给一个对象绑定多个事件处理函数：
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>无标题文档</title> 6 <script> 7 //给一个对象绑定一个事件处理函数的第一种形式 8 //obj.onclick = fn; 9 function fn1() {10 alert(this);11 }12 function fn2() {13 alert(2);14 }15 16 //document.onclick = fn1;17 //document.onclick = fn2; //会覆盖前面绑定fn118 19 //给一个对象的同一个事件绑定多个不同的函数20 //给一个元素绑定事件函数的第二种形式21 22 /*23 ie：obj.attachEvent(事件名称，事件函数);24 1.没有捕获25 2.事件名称有on26 3.事件函数执行的顺序：标准ie-》正序 非标准ie-》倒序27 4.this指向window28 标准：obj.addEventListener(事件名称，事件函数，是否捕获);29 1.有捕获30 2.事件名称没有on31 3.事件执行的顺序是正序32 4.this触发该事件的对象33 */34 35 /*document.attachEvent('onclick', function() {36 fn1.call(document);37 });38 document.attachEvent('onclick', fn2);*/39 40 //是否捕获 : 默认是false false:冒泡 true：捕获41 42 /*document.addEventListener('click', fn1, false);43 document.addEventListener('click', fn2, false);*/44 45 function bind(obj, evname, fn) {46 if (obj.addEventListener) {47 obj.addEventListener(evname, fn, false);48 } else {49 obj.attachEvent('on' + evname, function() {50 fn.call(obj);51 });52 }53 }54 55 bind(document, 'click', fn1);56 bind(document, 'click', fn2);57 </script>58 </head>59 60 <body>61 </body>62 </html>事件取消：
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>无标题文档</title> 6 <script> 7 /* 8 第一种事件绑定形式的取消 9 */10 function fn1() {11 alert(1);12 }13 function fn2() {14 alert(2);15 }16 17 //document.onclick = fn1;18 //document.onclick = null; //取消19 20 /*21 ie : obj.detachEvent(事件名称，事件函数);22 标准 : obj.removeEventListener(事件名称，事件函数，是否捕获);23 */24 /*document.attachEvent('onclick', fn1);25 document.attachEvent('onclick', fn2);26 document.detachEvent('onclick', fn1);*/27 28 document.addEventListener('click', fn1, false);29 document.addEventListener('click', fn1, true);30 document.addEventListener('click', fn2, false);31 32 document.removeEventListener('click', fn1, false);33 </script>34 </head>35 36 <body>37 </body>38 </html>新闻热点
疑难解答
