delegate(sel,[type],[data],fn)

最后更新于:2022-04-01 05:55:55

### 返回值:jQuery delegate(selector,[type],[data],fn) ### 概述 指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。 使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。 ### 参数 #### **selector,[type],fn**String,String,Function*V1.4.2* **selector:**选择器字符串,用于过滤器触发事件的元素。 **type:**附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。 **fn:**当事件发生时运行的函数 #### **selector,[type],[data],fn**String,String,Object,Function*V1.4.2* **selector:**选择器字符串,用于过滤器触发事件的元素。 **type:**附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。 **data:**传递到函数的额外数据 **fn:**当事件发生时运行的函数 #### **selector,events**String,String*V1.4.3* **selector:**选择器字符串,用于过滤器触发事件的元素。 **events:**一个或多个事件类型的字符串和函数的数据映射来执行他们。 ### 示例 #### 描述: 当点击鼠标时,隐藏或显示 p 元素: ##### HTML 代码: ~~~ <div style="background-color:red"> <p>这是一个段落。</p> <button>请点击这里</button> </div> ~~~ ##### jQuery 代码: ~~~ $("div").delegate("button","click",function(){ $("p").slideToggle(); }); ~~~ #### 描述: delegate这个方法可作为live()方法的替代,使得每次事件绑定到特定的DOM元素。 ##### 以下两段代码是等同的: ~~~ $("table").delegate("td", "hover", function(){ $(this).toggleClass("hover"); }); ~~~ ~~~ $("table").each(function(){  $("td", this).live("hover", function(){   $(this).toggleClass("hover");  }); }); ~~~
';