007 events

A: Event

1. The difference between binding events

　　addEventListener，attachEvent

　　The same point: Events are binding element

　　Different points: the number of different parameters

　　　　　　Different browser support.

　　　　　　addEventListener Google and Firefox support, IE8 does not support, IE11 support, attchEvent: Google and Firefox do not support, IE11 does not support, IE8 support

　　　　　　Different this, addEventListener in this subject is currently bound events, attachEvent is in this window

2. unbundling

　　The first way:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <input type="button" value="第一个" id="btn1">
 9     <input type="button" value="第二个" id="btn2">
10     <script>
11         document.getElementById("btn1").onclick=function(){
12             console.log("第一个");
13         };
14         //解绑
15         document.getElementById("btn2").onclick=function(){
16             document.getElementById("btn1").onclick=null;
17         }
18     </script>
19 </body>
20 </html>

　　The second way:

　　　　You should use a named function to take effect.

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6 </head>
 7 <body>
 8     <input type="button" value="第一个" id="btn1">
 9     <input type="button" value= "Second" ID = "btn2" > 
10      < Script > 
. 11          function F1 () {
 12 is              the console.log ( " first " );
 13 is          }
 14          function F2 () {
 15              the console.log ( " first a " );
 16          }
 . 17          document.getElementById ( " btn1 " ) .addEventListener ( " the Click " , F1, to false );
 18 is          Document.getElementById("btn1 " ) .addEventListener ( " the Click " , F2, to false );
 . 19          // unbundling, the first event will release 
20 is          document.getElementById ( " btn2 " ) .onclick = function () {
 21 is              document.getElementById ( " btn1 " ) .removeEventListener ( " the Click " , F1, to false );
 22 is          }
 23 is      </ Script > 
24  </ body > 
25  </html>

Guess you like