JQuery数据表中的按钮赢得'；t调用JQuery函数

我在MVC5视图中有一个表，它重复了一行行数据。每一行都有一个按钮，单击该按钮时，将使用JQuery将数据id传递到一个隐藏的文本框中

MVC视图

@foreach (var item Model.MyList) {

//<tr> etc
<td>
  <button class="btn btn-danger btn-xs" id="btnDelete" data-toggle="modal" data-target="#myModal" data-id="@item.ID"> Delete </button>
</td>

}

出于几个原因，我决定将我的桌子换成。现在的问题是，当用户单击Datatable中的Delete按钮时，不再调用我的JQuery click函数，因此删除ID不会传递到我的隐藏文本框中

这是我的DataTable脚本

<script>
    $(document).ready(function () {
        $('#dataTables-example').dataTable({  
            "bServerSide": true,  
            "sAjaxSource": "/MyController/GetAjaxData",
            "bProcessing": true,
            "bJQueryUI": true,
            "aoColumns": [
                      { "sName": "ID", "visible": false },
                      null, //FullName
                      null, //Email
                      null, //LastLoginDate
                      {
                          "mData": null,
                          "mRender": function (data, type, full) {
                              return "<button class='btn btn-danger btn-xs' id='btnDelete' data-toggle='modal' data-target='#myModal' data-id='"+ full[0] +"'>Delete</button>";

                          }
                      }

            ]
        });  
    });  
</script>

$（文档）.ready（函数（）{
$（'#dataTables示例'）。dataTable（{
“bServerSide”：正确，
“sAjaxSource”：“/MyController/GetAjaxData”，
“bProcessing”：正确，
“bJQueryUI”：没错，
“aoColumns”：[
{“sName”：“ID”，“visible”：false}，
null，//FullName
null，//电子邮件
null，//LastLoginDate
{
“mData”：空，
“mRender”：功能（数据、类型、完整）{
返回“删除”；
}
}
]
});  
});  

有谁能看看为什么会发生这种情况，或者就如何解决问题向我提供建议吗

非常感谢。

而不是

$（'.btn.btn danger'）。单击（函数（）…

尝试使用上的

.on将事件绑定到稍后创建的dom元素

很多人已经问过这个问题。看到了吗

<script>
    $(document).ready(function () {
        $('#dataTables-example').dataTable({  
            "bServerSide": true,  
            "sAjaxSource": "/MyController/GetAjaxData",
            "bProcessing": true,
            "bJQueryUI": true,
            "aoColumns": [
                      { "sName": "ID", "visible": false },
                      null, //FullName
                      null, //Email
                      null, //LastLoginDate
                      {
                          "mData": null,
                          "mRender": function (data, type, full) {
                              return "<button class='btn btn-danger btn-xs' id='btnDelete' data-toggle='modal' data-target='#myModal' data-id='"+ full[0] +"'>Delete</button>";

                          }
                      }

            ]
        });  
    });  
</script>