jQuery [button.class] 未检测到使用按钮附加行

Appending a row with a button is not detected with jQuery [button.class]

好吧,我基本上有一个 table 由 PHP 为每一行绘制。在该行中,我有数据和一个 "delete" 按钮来删除特定行。

<?php
   if ($result->num_rows > 0) {
     // output data of each row
     while($row = $result->fetch_assoc()) {
         echo "<tr class='btnDelete' data-id=" . $row["username"]. "><td>" . $row["id"]. "</td><td>" . $row["username"]. "</td><td><span class='label label-success'>" . $row["active"]. "</span></td><td><button class='btn btn-danger btnDelete btn-xs' href=''>delete</button></td></tr>";
     }
}   
?>

要删除该行,我有一个脚本可以在单击按钮时使用数据 ID 显示模式,如下所示。

        $('button.btnDelete').on('click', function (e) {
            e.preventDefault();
            var id = $(this).closest('tr').data('id');
            $('#myModal').data('id', id).modal('show');
            $('#modaltitle').text('User ID: ' + id);    
        });

但是,问题是:当我使用 jQuery 追加到 table 时,该行会正确显示并添加到数据库中,但删除按钮不会弹出模式删除行。只有刷新页面才会删除

从源代码来看,附加行的代码对我来说没问题。

最后,这是附加行的来源。

        $('#btnAdd').click(function () {
            var user = $('#user').text();
            var newuser = $('#txtUserAdd').val().toLowerCase();
            var dataString = 'user='+ user.toLowerCase() + '&user2=' + newuser;
           $.ajax({
           type: "POST",
           url: "../adduser.php",
           data: dataString,
           cache: false,
           success: function(result){
           console.log(result);
           $('#userlist tr:last').after("<tr class='btnDelete' data-id="+ newuser + "><td>ID</td><td>" +newuser+ "</td><td><span class='label label-success'>Active</span></td><td><button class='btn btn-danger btnDelete btn-xs' href=''>delete</button></td></tr>");
            }
            });
        });

非常感谢您的帮助,如果您需要更多信息,请告诉我。

将按钮事件更改为:

$("#datatable").on("click", "button", function(event){
            event.preventDefault();
            var id = $(this).closest('tr').data('id');
            $('#myModal').data('id', id).modal('show');
            $('#modaltitle').text('User ID: ' + id);    
        });

其中:

<tbody id="datatable">