-2

我有一个脚本,当用户单击页面上的某些 div 链接时,它会动态地将行添加到表中。我现在正在尝试添加一个删除按钮,以便用户可以摆脱他们不想要的添加行,但我在让它们工作时遇到了问题。

我用来删除表格行的代码来自这里。我的代码是:

$('.addRow').click(function() {
      var tr = $(
      '<tr><td class="cat"></td>' 
      + '<td class="sel"></td>'
      + '<td><textarea name="paragraph[' + count + ']">Click to edit (id ' + count + ')</textarea><input type="hidden" name="catText[' + count + ']" class="hiddenCat"><input type="hidden" name="selText[' + count + ']" class="hiddenSel">'
      + '</td><td><button type="button" class="removebutton">Remove row</button></td></tr>');
      $('.mainTable > tbody:last').one().append(tr);
      tr.find(".cat").text($(this).closest("li.category").attr("title"));
      tr.find(".hiddenCat").val($(this).closest("li.category").attr("title"));
      tr.find(".sel").text($(this).closest("li.select").attr("title"));
      tr.find(".hiddenSel").val($(this).closest("li.select").attr("title"));
      count++;
    });

     $('.removebutton').click(function() {
      alert('Hello');
      var whichtr = $(this).closest("tr");       
      whichtr.remove();      
    });

addRow 函数将表行附加到选定的表。在其中一个单元格中有一个带有“removebutton”类的按钮。单击此按钮时,它应该删除该行。出于测试目的,使用警报消息;但是,当我单击使用 addRow 动态生成的按钮之一时,什么也没有发生。

当我静态添加按钮或链接到“removebutton”类时,会显示警报消息。

为什么在通过 jQuery 创建按钮时会出现问题,使其无法正常工作?

4

2 回答 2

2

用于.on动态内容:

$(document).on('click', '.removebutton', function() {
  alert('Hello');
  var whichtr = $(this).closest("tr");       
  whichtr.remove();      
});
于 2013-05-03T15:45:29.487 回答
2

您需要动态创建元素的事件委托

$('.mainTable').on('click','.removebutton',function() {
  alert('Hello');
  var whichtr = $(this).closest("tr");       
  whichtr.remove();  
});

http://api.jquery.com/on/

于 2013-05-03T15:46:50.367 回答