Home > Web Front-end > JS Tutorial > Summary of usage and differences between bind and live in jQuery_jquery

Summary of usage and differences between bind and live in jQuery_jquery

WBOY
Release: 2016-05-16 17:02:25
Original
1087 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.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template