jquery 代理 index

jQuery 中的代理是一种常用的技术，它可以允许我们为一个选择器匹配的多个元素分别绑定或触发事件。在 jQuery 1.7 及以上版本中，代理事件的语法被统一为

.on( events [, selector ] [, data ], handler )

其中的 selector 参数用于指定想要绑定或触发事件的元素选择器，如果该参数被忽略，则使用当前的选择器来代理事件。

在使用代理绑定事件时，我们通常会经常用到 index() 方法。index() 方法返回一个数值，表示当前元素在相应选择器匹配列表中的位置，也可以使用它获取当前元素相对于兄弟元素的位置。

$('ul li').on('click', function() {
  console.log($(this).index());
});

上面的代码表示，当匹配到的 ul 元素中的 li 子元素被点击时，控制台将输出被点击元素在其所在 li 列表中的位置。

另外，如果希望在代理事件时获取相对于所选元素的位置，可以将 selector 参数设为代理元素子元素的选择器：

$('ul').on('click', 'li', function() {
  console.log($(this).index());
});

上面的代码表示，当 ul 元素的子元素 li 被点击时，控制台将输出被点击元素相对于其兄弟元素的位置。