Question

为了避免以“主要基于意见为基础”的关键按钮，我不是在寻找关于“最佳”方式的意见;我只是想知道是否有一个更为直接的解决方案，我不知道。

我的目标是在页面上的所有（数百个）复选框中添加相同的onclick方法。我第一次尝试jQuery解决方案是这样的：

$('input[type="checkbox"]').prop('onclick', function(){alert("Boop!");})

但是这会遇到$ .prop（）的计算值行为，并立即为每个复选框调用该函数。

所以我可以这样做：

$('input[type="checkbox"]').prop('onclick', function(){return function() {alert("Boop!");}})

但是这感觉非常糟糕。或者，我可以这样做：

$('input[type="checkbox"]').each(function(_, cb) {
  cb.onclick = function(){alert("Boop!");};  
});

但对于jQuery来说，这似乎是非常简单的手册。

所以我错过了一个更简单的解决方案吗？

Answer 1

声明函数，然后只按名称引用它：

function handler() { alert("Boop!"); }

$("input[type='checkbox']").on("click", handler);

请注意，您不应该通过设置“onfoo”属性来设置事件处理程序。

编辑 - 如果你想避免的是一遍又一遍地添加处理程序，请使用委托：

$("body").on("click", "input:checkbox", handler);

只创建一个事件处理程序注册。当“click”事件将DOM冒泡到正文时，jQuery将检查哪些目标元素与选择器匹配，并为那些执行操作的人调用处理程序。（意见 - 我主要采用专属的做法，对所有事件使用正文级别委派。这样可以减少麻烦。）

Answer 2

你必须写活动没有用prop：

$('input:checkbox').on('click', function(){alert("Boop!");})

我建议使用更改事件复选框点击：

$('input:checkbox').on('change', function(){
   if(this.checked)
   {
   alert("checked");
   }

});