Jquery 使用数据表和引导模式

我有一个数据表，其中有200多条记录，每行都有删除该记录的按钮，当按下该按钮时，会弹出一个来自引导的模式

问题是，当我使用dataTable中的分页选项更改“页面”时，模式中的信息不会用相应的ID更新。当我从第一页单击任何行时，它工作正常，但当我更改页面时，信息会被我从第一页按下的最后一个ID阻塞

有什么想法吗

Mi代码如下所示：

<table class="table table-bordered table-hover tablewithtooltip" id="dataTable">
  <thead>
    ...
  </thead>

  <tbody>
    <tr>
      <td>
        <a href="#myModal" role="button" class="btn delete-smt-btn" data-toggle="modal" id="111">Delete Row</a>
      </td>
      <td>Some info</td>
    </tr>

    <tr>
      <td>
        <a href="#myModal" role="button" class="btn delete-smt-btn" data-toggle="modal" id="112">Delete Row</a>
      </td>
      <td>Some info</td>
    </tr>

    ...

  </tbody>
</table>

...
一些信息
一些信息
...

这是我的jQuery：

$('body').on('hidden', '#myModal', function () {
  $(this).removeData('modal');
});

var table = $('#dataTable').dataTable({
    "sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
    "sPaginationType": "bootstrap",
    "aaSorting": [[ 3, "asc" ]],
    "oLanguage": {
        "sLengthMenu": "Mostrar _MENU_ registros por página"
    }
});

$('.delete-smt-btn').on('click', function(e){
    id = e.currentTarget.id;
    url = "mypage.com/something?p_something=" + id;

    $('#myModal').modal({
        remote : url
    });
    $('#myModal').removeData();
});

// I have some tooltips on my table, and I was having kind of the same issue when
// I changed pages with dataTable, the tooltip wasnt showing and I solved it with
// this but I cant make it work with modal.

    table.$('[rel="tooltip"], [data-toggle=tooltip]').tooltip({
      html: true
    }).click(function(e) {e.preventDefault();});

$（'body'）。关于（'hidden'，'myModal'，函数（）{
$（this.removeData（'modal'）；
});
变量表=$（'#dataTable'）。dataTable({
“sDom”：“t”，
“sPaginationType”：“引导程序”，
“aaSorting”：[[3，“asc”]，
“语言”：{
“长菜单”：“最长菜单”
}
});
$（'.删除smt btn'）。在（'单击'）上，函数（e）{
id=e.currentTarget.id；
url=“mypage.com/something？p_something=“+id；
$（“#myModal”）.modal({
远程：url
});
$（'#myModal'）.removeData（）；
});
//我有一些工具提示在我的桌子上，当我
//我用dataTable更改了页面，工具提示没有显示，我用
//但我不能让它与模态一起工作。
表.$（'[rel=“tooltip”]，[data toggle=tooltip]'）。工具提示({
html：对
}).单击（函数（e）{e.preventDefault（）；}）；

尝试将委派事件侦听器附加到表中。当表最初呈现时，事件处理程序将附加到按钮上，但是当您在表中翻页时，这些按钮将被销毁并创建新的按钮。这些新按钮是在分配处理程序后创建的，因此它们不会侦听

单击事件

对于这样的情况，如果有许多元素在同一事件上触发相同的函数，那么最好使用委托事件侦听器。委派事件仅分配一个处理程序，否则您将为每个元素分配一个处理程序，这将影响内存/性能

$('#dataTable').on('click', '.delete-smt-btn', function(e){
    id = e.currentTarget.id;
    url = "mypage.com/something?p_something=" + id;

    $('#myModal').modal({
        remote : url
    });
    $('#myModal').removeData();
});

这是最普遍的解决办法

$('#myModal').on('hidden', function () {
  $(this).removeData('modal');
});