jquery事件delegate()方法用法详解

jQuery的delegate()方法用于在匹配元素的子元素上添加事件处理程序，它的语法格式为：

$(selector).delegate(childSelector, eventType, function)

其中，selector表示要绑定事件的父元素选择器，childSelector表示要绑定事件的子元素选择器，eventType表示要绑定的事件类型，function表示事件处理程序。

delegate()方法与on()方法类似，但有一个重要的区别是，delegate()方法在父元素上绑定事件处理程序，而on()方法是在匹配元素上直接绑定事件处理程序。

当父元素的子元素被点击时，delegate()方法会自动触发事件处理程序。这对于动态生成的元素非常有用，因为它能够处理在绑定事件之前就存在的元素。

下面是delegate()方法的一些常用示例：

1. 绑定点击事件：

$('ul').delegate('li', 'click', function(){
  $(this).toggleClass('selected');
});

上述代码会在ul元素的子元素li被点击时，切换它的选中状态。

2. 绑定鼠标移入事件：

$('ul').delegate('li', 'mouseenter', function(){
  $(this).addClass('hover');
});

上述代码会在ul元素的子元素li被鼠标移入时，添加hover类。

3. 绑定表单提交事件：

$('form').delegate(':submit', 'click', function(){
  // 表单提交逻辑
});

上述代码会在form元素的子元素中匹配到的提交按钮被点击时，执行相应的表单提交逻辑。

总结起来，delegate()方法可用于在父元素上绑定事件处理程序，它能够处理动态生成的子元素，非常灵活实用。