Jquery删除表行不起作用答案

【问题标题】：Jquery remove table row not workingJquery删除表行不起作用
【发布时间】：2011-05-01 19:33:03
【问题描述】：

基本上是点击按钮生成表格行，然后点击减号按钮删除行。

我尝试了以下几种方法，但都不起作用。 -.bind -。居住 -正常方式

由于表格是动态生成的，它似乎无法正常工作。

<script language="JavaScript" src="jquery-1.4.3.min.js" type="text/javascript"></script>

 <script type="text/javascript">

 $(document).ready(function() {    

  var html = '';
  var rows= 5;
  var cols= 4;

  $('#btnGenTable').bind("click", function() {

   for (var r = 1; r <= rows; r++) 
   {
    html += '<tr>';

    for (var c = 1; c <= cols; c++) 
    {
     cellText= "row " + r + " col " + c;
     html += '<td>aa</td>';
    }

    html+= '<td><img class="delete" src="minus.jpg" /></td>';

    html += '</tr>';
   };


   $('.inner').html('').append(html);

  });


$('table tbody tr td img.delete').click(function(){
    alert('clicked');
        $(this).parent().parent().remove();
});

 });

</script>

<br />


<table id="tblsize" class="inner" border="1" width="80%">
</table>


<input type=button value="Generate Table" name="btnGenTable" id="btnGenTable" class=text100>

【问题讨论】：

对我来说很好。确保在属性 jsbin.com/iqini3/edit 周围加上 "
请在你的函数中添加一个警报框，并检查警报框是否到来。
$('table tbody tr td img.delete').click 作为动态表运行时不起作用，如果作为静态预先存在的表运行，它将起作用。有什么想法吗？

标签： jquery dynamic html-table row

【解决方案1】：

要在单击图像时删除一行，请在 $(document).ready 块中插入以下代码。

$('img.delete').live('click', function() {
    $(this).parent().parent().remove();
});

【讨论】：

【解决方案2】：

我知道这个问题很老，但我遇到了同样的问题。 live() 方法自 jQuery 1.7 版以来已被弃用，并将在 1.9 版中删除。你可以改用这个：

$(document).on('click', '.delete', function(){
    $(this).closest('tr').remove();
});

【讨论】：

【解决方案3】：

您只需要：

  $('.delete').live('click', function(){
          $(this).closest('tr').remove();   
      });

在您的文档就绪处理程序中。

这是一个工作示例： http://jsfiddle.net/5bWcT/

【讨论】：

jsfiddle.net 是一个很棒的工具