jQuery notes (event binding settlement tied)

Event binding
one, the bind ()
1. passed two parameters The first parameter is the event name, the second is the event handler
2. pass key-value pair (target)
<body>
    <input type="button" value="点我" id="btn">
</body>
$ ( "# btn") the bind ( "the Click",. function () { 
    Alert ( "I do not think you, I think I want" ); 
}); 

// write or
key-value pair (target)
$ ( "# btn. ") the bind ({" the Click ": function () {
Alert (" I do not think you, I think I want ");
}});
// multiple events share an event handler of time, you can also write 
$ ( "# btn") the bind ({ "mouseOver mouseout":. Function () {
$ (the this) .append ( "<the p-> I do not What do you think, I think I want </ the p-> ")
}});

二, delegete ()
delegete () and bind () is similar to 
the difference is that this function is a sub-element binding function
parameters: 1 to bind the child element event
2. Event
3. Event handler

three, on ()
The most recommended event binding methods, mainstream 
combines the use of both bind and delegate
when two parameters :( similar to Bing)
1. name of the event
2. Event handler
three parameters :( similar delegate)
1. Event name
2. the sub-element binding event
3. event handler
following two writing, to achieve the effect is the same oh
<div the above mentioned id = "dv"> 
  <the Button> refrigerator not how to do </ the Button> 
</ div>
The first written // 
$ ( "# dv the Button") ON. ( "The Click", function () { Alert ( "buy!" ); });
// second written $ (
"#dv"). ON ( "the Click", "Button", function () { Alert ( "Buy!" ); });

Event unbundling

There have binding unbundling 
* OFF ON <=>
* delegate <=> undelegate
* <=> unbind the bind
* Note: unbundling, unbundling only event itself, not the child of the event unbundling.

About bubbling, you can avoid bubbling return false

Summary:
* the bind ():
* 1 $ ( 'element binding events ") .bind (" event ", the event handler);
* 2 $ (' element binding events") .bind ({ " event 1 ", an event handler," event 2 ", the event handler 2, ..." n-event ", event handler} n-);
* the delegate ():
* $ (" parent element ") .delegate ( "child element", "event", the event handler);
* ON ():
* 1 $ ( 'element binding events ") .on (" event ", the event handler);.
* 2. $ ( "binding element event") .on ({ "event 1", an event handler, "event 2", the event handler 2, ... "n-event", event handler} n-);
*. 3 . $ ( "parent element") .on ( "" event "child element", the event handler);
* on<=>off
* delegate<=>undelegate
* bind<=>unbind
 



Guess you like

Origin www.cnblogs.com/baabaabaa/p/11530533.html
Recommended