jquery – 多个元素的单击处理程序？

我正在寻找一个点击处理程序添加到一个div.但是有没有办法使用单个点击处理函数并在多个div之间共享？由于我可能有100个div,我不想为每个div创建一个点击处理程序(他们几乎都会做同样的事情). jquery示例显示：

$("p").click(function () { 
    $(this).foo(); 
});

我们可以做一些像：

$("p").click(myClickHandler);

function myClickHandler(source) {
    source.foo();
}

？

解决方法

如果不想要数百个点击事件的开销,jQuery的.delegate()方法是一个很好的方法.

它将一个事件分配给容器,当容器的指定后代获取事件时,该容器将被触发.

测试示例：https://jsfiddle.net/jYKgm/210/

HTML

<div id="container">  // #container has the event handler assigned
    <div>content</div>
    <div>content</div>
    <div>content</div>
    <div>content</div>
    <div>content</div>
    <div>content</div>
</div>​

jQuery的

// The click event handler will fire when <div> elements  
   //   that descend from #container get clicked.
$('#container').delegate('div','click',function() {
    alert('index ' + $(this).index() + ' was clicked');
});

这将为#container元素分配一个处理程序,并使其成为任何后代的div元素将触发处理程序.

所以如果有500个后代的div元素,他们将共享一个事件处理程序.

– .delegate() – http://api.jquery.com/delegate