廢話不多說，直接上代碼
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title></title><style type="text/css">div{background-color:lightblue;margin:5px;padding:5px;}</style><script src="Scripts/EventUtil.js" type="text/javascript"></script><script type="text/javascript">var changeSize = function () {var oTxt = document.getElementById('txt');oTxt.size += 5;}var showMessage = function () {alert('單擊事件');alert('事件類型：' + event.type);}window.onload = function () {document.getElementById('btn1').onclick = function () {alert('btn1單擊事件');}}</script></head><body><input type="text" id="txt" size="10"/><input type="button" value="加長" onclick="changeSize()"/><input type="button" value="點我" onclick="showMessage()"/><input type="button" id="btn1" value="按鈕" /><p> 只有三次抽獎機會！ </p><input id="btnLottery" type="button" value="抽獎"/><div id="divResult"></div><script type="text/javascript">var times = 0; //次數var arr = ['一千萬', '女神一枚', '布加迪威龍', '海景別墅', '全英雄全皮膚','無限充值','逢賭必贏'];var btnLottery = document.getElementById('btnLottery');btnLottery.onclick = function () {if(times >= 3){alert("你已經抽完三次了！");this.onclick = null;return;}times++;var n = Math.floor(Math.random() * arr.length); //數組中隨機抽一個var divResult = document.getElementById('divResult');divResult.innerHTML = "<p>您是第"+ times +"次抽獎，抽中的是："+ arr[n] +"</p>"}</script><input type="button" id="btnDOM2Test" value="測試DOM2事件處理"/><input type="button" id="btnDelDOM2Test" value="測試DOM2刪除事件處理"/><script type="text/javascript">var sayHi = function () {alert('Hello!');}var btnDOM2Test = document.getElementById('btnDOM2Test');btnDOM2Test.addEventListener('click', function () {alert('您單擊的是：' + this.value);}, false);btnDOM2Test.addEventListener('click', sayHi, false);var btnDelDOM2Test = document.getElementById('btnDelDOM2Test');var del = function () {btnDOM2Test.removeEventListener('click', function () { alert('您單擊的是：' + this.value);}, false);btnDOM2Test.removeEventListener('click', sayHi, false);}btnDelDOM2Test.addEventListener('click', del, false);//IE9+//btnDOM2Test.attachEvent("onclick", sayHi);//btnDOM2Test.attachEvent("onclick", function () {// alert("IE事件綁定!");//});</script><label for="txtPhoneNum">請輸入手機號碼</label><input type="text" id="txtPhoneNum"/><script type="text/javascript">var txtPhoneNum = document.getElementById('txtPhoneNum');EventUtil.addHandler(txtPhoneNum, 'keypress', function () {var e = EventUtil.getEvent();//alert(e.keyCode);//都不是數字if (e.keyCode < 48 || e.keyCode > 57) {EventUtil.preventDefault(e);}});</script><form id="frmDemo" action="submitPage.htm"><h3>用戶登錄</h3><label for="txtUID">賬號：</label><input type="text" id="txtUID"/><br /><label for="txtPWD">密碼：</label><input type="password" id="txtPWD"/><br /><input type="button" id="btnSubmit" value="登錄"/></form><script type="text/javascript">var txtUID = document.getElementById('txtUID');var txtPWD = document.getElementById('txtPWD');var btnSubmit = document.getElementById('btnSubmit');var frmDemo = document.getElementById('frmDemo');EventUtil.addHandler(btnSubmit, 'click', function () {alert('我提交了！');if (txtUID.value == "admin") {frmDemo.submit(); //提交}else {return;}});EventUtil.addHandler(txtUID, 'keydown', function () {var e = EventUtil.getEvent(); //Enter.keyCode = 13;if (e.keyCode == 13) {txtPWD.focus();EventUtil.preventDefault(e);}});</script><div onclick="this.style.backgroundColor='red'; event.cancelBubble=true;">div1<div onclick="this.style.backgroundColor='blue';">div2<div onclick="this.style.backgroundColor='black';">div3</div></div></div></body></html>以上這篇JavaScript事件方法(實例講解)就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持武林網。
新聞熱點
疑難解答
