javascript - 将多个点击处理程序合并为一个

Question

假设我有两个执行相同功能的单击处理程序：

$('#div1').click(function(event) {  
alert('here');                              
});

$('#div2').click(function(event) {  
alert('here');                              
});

如何将这两个处理程序合并为一个而不是重复调用 alert ？

就像是 ：

$('#div1').click.('#div2').click(function(event) {  
alert('here');                              
});

Answer 1

第一种方式：

$('#div1, #div2').click(function(event) {  
     alert('here');                              
});

第二种方式：

function doIt(e) {
    alert('here');
}
$('#div1').click(doIt);
$('#div2').click(doIt);

请注意，您遇到此问题的事实有时意味着您应该使用一个类而不仅仅是 id，这样您就可以执行类似的操作

$('.alertable').click(function(event) {  
     alert('here');                              
});

Answer 2

试试这个：

$('#div1, #div2').click(function(event) {  
   alert('here');                              
});

此外，如果您有很多div元素，包含在一个共同的父级中，您可以利用事件委托并将单个处理程序附加到父级本身，如下所示：

$('.common-parent').on('click', 'div', function(event) {  
   ...                          
});