当我使用append函数附加某个内容时，我无法使用jquery控制它

when i append something using the append function i dont have control over it using jquery

本文关键字：控制 jquery 函数 append      更新时间：2023-09-26

这是我的一个简单演示，这是一个只有一行的表，

<table id="test_table">
    <tr>
        <td>name</td>
        <td>age</td>
        <td>action</td>
    </tr>
    <tr>
        <td>test name</td>
        <td>20</td>
        <td class="delete">delete</td>
    </tr>
</table>

如果我点击删除td，这一行将被隐藏

  $('.delete').click(function(){
      $(this).parent().parent().hide();
  });

我有一个简单的姓名和年龄形式，当我点击添加按钮时，它会将其附加到表中

 $('#test_input').click(function(){
        var name = $('#name').val();
        var age = $('#age').val();
        $('#text_table').append('<tr><td>'+name+'</td><td>'+age+'</td><td     class="delete">delete</td></tr>');
  });

问题是，如果我点击新的附加行，它会隐藏起来，就像它不在那里一样，无论我试图使用附加行做什么，它都不会接受它，我做错了什么吗？

$('#test_table')应为$('#test-table')。

您应该在添加的行上绑定单击。

另一种解决方案是创建委托事件。

$('body').on('click', '.delete', function() {
    $(this).parent().parent().hide();
});
相关文章：