jQuery的.on()方法只起作用一次

Question

我有一个带有多个复选框输入的表格：

<form>
<table id="table">
    <tr>
      <td><input type="checkbox" value="1" class="someClass"></td>
      <td><input type="checkbox" value="1" class="someClass"></td>...

当复选框被选中/取消选中时，一些jQuery从另一个文件刷新该表格：

$(".someClass").on("change", function() {
        $('#edit').ajaxSubmit(); //Submitting the form with id "edit"
        $("#table").load("tablerefresh");
 });

我的问题是，当我勾选/取消复选框时，表格只会刷新一次，但它应该在每次勾选/取消时都刷新。我已经到处找过，但似乎找不到解决方法。你有什么想法吗？

- user2653629

---

你可能想尝试钩取一个不会重新加载的元素（例如你的示例中的<form>），并使用适当的过滤器来处理复选框的事件。 - billc.cn

.on 应该在不变的父元素或 document 上执行。 - Patrick Evans

你的代码看起来没问题。看看这个链接：http://jsfiddle.net/LEukL/ 查看你的控制台，看看是否有什么东西导致你的代码崩溃并停止执行。 - Daniel Wardin

为了更好地理解其他评论或答案，.on()文档中有关于委托事件的说明，这是你应该在这里使用的。 - millimoose

Answer 1

可能是一个委托问题，因为#table没有改变，所以将其用作范围，针对内部的.someClass：

$("#table").on("change", ".someClass", function() {
  $('#edit').ajaxSubmit(); //Submitting the form with id "edit"
  $("#table").load("tablerefresh");
});

注意：

你也可以使用 delegate()：

$("#table").delegate(".someClass", "change", function(){
  //Code
});

- George

---

我都试过了，它们都完美地工作了，感谢你的帮助！ - user2653629

Answer 2

try this:

$(document).on("change", ".someClass" , function() {
        $('#edit').ajaxSubmit(); //Submitting the form with id "edit"
        $("#table").load("tablerefresh");
 });

- Alessandro Minoccheri