Summary of usage and differences between bind and live in jQuery

Summary of usage and differences between bind and live in jQuery_jquery

WBOY

Release： 2016-05-16 17:02:25

Original

1023 people have browsed it

Before introducing these two methods first, we commonly use the click() method

Copy the code The code is as follows:

$("a").click(function() {
 alert("hello");
});

click( ) method is a simple method of bind() method. In bind(),
all jQuery JavaScript event objects, such as focus, mouseover, and resize,
can be passed in as type parameters.

Parameters: type,[data],function(eventObject)
For example:

Copy code The code is as follows:

$("p").bind("click",function(){
 alert("hello");
})

You can also pass parameters

Copy code The code is as follows:

var message = "how are you!";
$("p").bind("click",{msg:message},function(e){
 alert(e.data.msg);
} )

live() attaches an event handler to all matching elements,
even if the element is added later. As follows:

Copy code The code is as follows:

Click me

$(".mytd").bind("click",function(){
alert("hello");
})

Click me and it will pop up hello

Add a new element at this time

Copy the code The code is as follows:

$ (".mytr").after(" added after ");

This When using bind to click "added after", it will not be executed
Use the live() method instead

Copy code Code As follows:

$(".mytd").live("click",function(){
 alert("hello");
})

The
.live() method can be effective on an element that has not been added to the DOM due to the use of event delegation:
Event handlers bound to ancestor elements can respond to events triggered on descendants. .
The event handler passed to .live() will not be bound to the element, but will be treated as a special event handler and bound to the root node of the DOM tree.