jQuery - 删除表中的行

Question

我试图使用jQuery删除表中的行.该表将按钮显示为一行中的第一项.单击该按钮应该从MySQL表中删除该行.

这是javascript代码

      $("#list .del").click(function() {
      cell = $(this);
      row  = cell.closest("tr");
      vid = row.find (".vid");
      alert (vid.text());

      $.post ("db_deleteplayer.php",
        {vid:vid.text()},
        updateSignup);
      return;

    }) //#list .del click      


    function updateSignup(data) {
        $('#list').html(data);
      return;
    }

这适用于我想要删除的第一行但之后失败.我在Firefox,Chrome和IE中证实了这一点.

我的猜测是第一次删除是修改DOM而jQuery变得混乱.有人可以解释一下我哪里出错了吗？

Answer 1

更改:

$("#list .del").click(function({

至:

$("#list").on('click', '.del', function(){

基本上,当您调用时,$('#list').html(..)您正在替换其中的元素#list,并且在执行此操作时,您将删除以前绑定的事件处理程序.

通过替换为.on('click', '.del', function...,您将处理程序附加到#list,它始终保留在DOM中(在您的示例中).然后,处理程序检查事件原始目标,查看它是否具有该类.del,并执行处理程序(如果有).

阅读有关委派活动的更多信息:https://stackoverflow.com/a/8111171/1238887