Home > Developer > Web Develop
2. Bind multiple different functions to the same event for an object:
ie:obj.attachEvent (event name, event function)1. No capture 2. The event name is On3. Sequence of event function execution: standard IE-and positive order, non-standard IE---> Reverse 4.this point to WindowStandard: Obj.addeventlistener (event name, event function, whether capture)1. There is a capture 2. The event name is not On3. The order in which the event functions are executed: Positive sequence 4.this points to the object that triggered the event whether to capture:Default is false: Bubble true: Capture Pager A method under the function, the call methodThe first parameter can be changedfunction during the execution of thethe point of the internal this。 The second parameter of the call method starts with the argument list of the original function. Event Capture Sample code:1 <!DOCTYPE HTML>2 <HTMLLang= "en">3 <Head>4 <title>Event capture</title>5 <MetaCharSet= "UTF-8">6 <Metaname= "Viewport"content= "Width=device-width, initial-scale=1">7 <Script>8 window.onload= function(){9 functionfn1 () {Ten Alert ( This); One Alert (1); A } - functionfn2 () { - Alert ( This); the Alert (2); - } - /* - Document.onclick = fn1; + Document.onclick = fn2;//The back of the cover front of the - */ + A //IE wording at //document.attachevent (' onclick ', ' fn1 '); - //document.attachevent (' onclick ', ' fn2 '); - - //Standard notation - //document.addeventlistener (' click ', ' Fn1 ', false); - //document.addeventlistener (' click ', ' fn2 ', false); in - //compatible wording to functionbind (obj, Evname, fn) { + if(obj.addeventlistener) { - Obj.addeventlistener (Evname, FN,false); the }Else{ * Obj.attachevent (' on' +Evname,function(){ $ Fn.call (obj);Panax Notoginseng }); - } the } + bind (document,'Click', fn1); A bind (document,'Click', fn2); the } + - </Script> $ </Head> $ <Body> - <Div> - the </Div> - </Body>Wuyi </HTML>
Call Sample code:
1 <!DOCTYPE HTML>2 <HTMLLang= "en">3 <Head>4 <title>Pager</title>5 <MetaCharSet= "UTF-8">6 <Metaname= "Viewport"content= "Width=device-width, initial-scale=1">7 <Script>8 window.onload= function(){9 functionfn1 () {Ten Alert ( This); One } A - functionFn2 (A, b) { - Alert ( This); the Alert (A+b); - } - - //fn1 (); Window + //Fn1.call (); Pop-up window, this is equivalent to FN1 () - //Fn1.call (1);//Popup 1,call The first parameter is the point of this + //Fn2.call (1,4,10);//pop-up 1, 14, if the function has parameters, then the first is the point of this, followed by the parameters of the function band A Fn2.call (NULL,4,Ten); //window,14 is popped in turn, the first parameter is NULL, and the this point is not changed. at } - - - </Script> - </Head> - <Body> in <Div> - to </Div> + </Body> - </HTML>
JS Learning Note----Event bubbling, event capture
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
