Introduction to how to use jQuery event delegate()_jquery

Delegate Definition and Usage

delegate() method adds one or more event handlers to the specified element (belonging to the child elements of the selected element) and specifies to run when these events occur function.

Event handlers using the delegate() method apply to the current or future elements (such as new elements created by scripts).

参数	描述
childSelector	必需。规定要附加事件处理程序的一个或多个子元素。
event	必需。规定附加到元素的一个或多个事件。 由空格分隔多个事件值。必须是有效的事件。
data	可选。规定传递到函数的额外数据。
function	必需。规定当事件发生时运行的函数。

Syntax
$(selector).delegate(childSelector,event,data,function)

Return value: jQuery delegate(selector,[type],[data], fn)

Overview

Adds one or more event handlers to the specified element (a child element of the selected element) and specifies the function to run when these events occur.

Parameters
selector,[type],fnString,String,Function V1.4.2
selector: selector string, used to filter elements that trigger events.

type: One or more events attached to the element. Multiple event values ​​separated by spaces. Must be a valid event.

fn: function that runs when the event occurs

selector,[type],[data],fnString,String,Object,Function V1.4.2
selector: selector string , used to filter the element that triggers the event.

type: One or more events attached to the element. Multiple event values ​​separated by spaces. Must be a valid event.

data: extra data passed to the function

fn: function to run when an event occurs

selector, eventsString, String V1.4.3
selector: selector String for the element on which the filter triggered the event.

events: A data map of strings and functions for one or more event types to execute them.

Example
Description:
Hide or show the p element when the mouse is clicked:

HTML code:

Copy the code The code is as follows:

This is a paragraph.

Click here

jQuery code:

Copy code The code is as follows:

$("div").delegate("button","click",function(){
$("p").slideToggle();
});

Description: The delegate method can be used as an alternative to the live() method, allowing each event to be bound to a specific DOM element.
The following two pieces of code are equivalent:

Copy code The code is as follows:

$ ("table").delegate("td", "hover", function(){ $(this).toggleClass("hover");
});$("table").each(function() { $("td", this).live("hover", function(){ $(this).toggleClass("hover"); });
});