Javascript 单击从JQUERY调用我的函数

我试图减少JQUERY中的重复代码，但不知道如何从“on->click”函数调用我的函数

我的函数如下所示：

function myCheckAll(div, closer, finder){
    console.log(div+closer+finder);

      $(div).closest(closer).find(finder).prop('checked', this.checked); 
  }

$("input").on('click', {name: 'me'}, func);

function func(event) {
    console.log(event.data.name);
}

我试着用这样的话来称呼它

  $("#check_all_0").on('click', myCheckAll("#check_all_0", "table", "input#val0"));

我的问题是它不起作用。 我不明白的是：

1） 我在文档就绪括号外定义函数。 这就是我应该定义它的地方吗

2） 我一加载页面就调用控制台日志。没有单击目标，如果单击目标，它不会调用函数

我是jquery的新手，可能做了一些完全错误的事情，但如果有任何帮助，我将不胜感激。谢谢

 $("#check_all_0").on('click', myCheckAll("#check_all_0", "table", "input#val0"));

这将导致首先调用myCheckAll，并将结果作为事件处理程序传递给jQuery。您必须用一个函数来包装它：

$("#check_all_0").on('click', function() {
    myCheckAll("#check_all_0", "table", "input#val0"));
})

另请参见

您可以使用闭包：

$("#check_all_0").on('click', function() {
    myCheckAll("#check_all_0", "table", "input#val0");
});

---

尽管其他答案也在起作用，但我相信您正在寻找类似的答案：

function myCheckAll(div, closer, finder){
    console.log(div+closer+finder);

      $(div).closest(closer).find(finder).prop('checked', this.checked); 
  }

$("input").on('click', {name: 'me'}, func);

function func(event) {
    console.log(event.data.name);
}

适应您的代码：

$("#check_all_0").on('click', {div: "#check_all_0", closer: "table", finder:  "input#val0"}, myCheckAll);

function myCheckAll(event){
    console.log(event.data.div);
    console.log(event.data.closer);
    console.log(event.data.finder);
    $(event.data.div).closest(event.data.closer).find(avent.data.finder).prop('checked', this.checked); 
}

---

演示：

我不确定您想做什么，但它看起来像是一个“全选”功能，而这并不是您问题的答案。这可能会有帮助

$('#check_all_0').on('click',function(e){
   $(this).closest('table').find(':checkbox').prop('checked',$(this).prop('checked'));
});

---

如果看不到HTML，就不可能知道这是否正确，但您正在使用DOM ID查找内容，而这可能不是最好的方法。

“input#val0”

不要这样做。更改为

“#val0”

另一种方式速度较慢且冗余。如果

finder

是DOM ID，则不需要所有其他jQuery。在这种情况下，finder将是#val0，我可以剪切什么jQuery？

$（“#val0”）.prop（'checked'，this.checked）是您所需要的全部。+1用于添加错误解释和链接到源代码。