Javascript datatables表完成渲染后引发事件

我正在使用datatables并从ajax URL获取数据。我返回的表数据的每一行都包含一个字段，该字段呈现如下所示的按钮：

<button type="button" data-catid="8" data-catname="Programming:JavaScript"></button>

但是，我找不到这样做的方法，因此它发生在表呈现之后，并且按钮存在于dom中，因此我可以找到它并触发单击

我尝试过drawCallback和initComplete，但在按钮实际添加到dom之后，这两个选项都不会被触发，从而允许我使用jquery查找它

我有办法做到这一点吗？i、 e.在mytable完成通过ajax检索数据并呈现数据后触发我的单击

我使用的是DataTables1.10

编辑： 下面是如何将我的单击事件处理程序附加到汇总表

var selectedCat = 0;
$('#mydatatable :button').click(function () {
    selectedCat = this.getAttribute("data-catId");
    console.log("selecteCat is " + selectedCat);
    qDetailTable.ajax.url('/datatables/question-data/' + selectedCat).load();
    var selectedCatName = this.getAttribute("data-catName");
    $('#questDetailCat').text('Questions about: ' + selectedCatName);
    $('#questSummary').hide();
    $('#questDetail').show();
});

• 将单击处理程序移动到单独的函数中，例如：

  var selectedCat = 0;
  function OnCategoryClick(btn){
      selectedCat = btn.getAttribute("data-catId");
      console.log("selecteCat is " + selectedCat);
      qDetailTable.ajax.url('/datatables/question-data/' + selectedCat).load();
      var selectedCatName = btn.getAttribute("data-catName");
      $('#questDetailCat').text('Questions about: ' + selectedCatName);
      $('#questSummary').hide();
      $('#questDetail').show();
  });
  

  事件处理程序需要位于命名函数中，因为您将无法像jQuery DataTables一样为不在DOM中的元素触发click事件

• 更改如何附加单击处理程序

  $('#mydatatable').on('click', 'button', function () {
      OnCategoryClick(this); 
  });
  

  请记住始终对jQuery数据表中的元素使用委托事件处理程序，因为除第一个元素之外的其他页面的元素在DOM中不可用。有关更多详细信息，请参阅

• 使用API方法找到所需的按钮并调用处理程序函数

  OnCategoryClick（）

  用汇总表的实际ID替换

  datatable summary

  var selectedCat = 0;
  $('#mydatatable :button').click(function () {
      selectedCat = this.getAttribute("data-catId");
      console.log("selecteCat is " + selectedCat);
      qDetailTable.ajax.url('/datatables/question-data/' + selectedCat).load();
      var selectedCatName = this.getAttribute("data-catName");
      $('#questDetailCat').text('Questions about: ' + selectedCatName);
      $('#questSummary').hide();
      $('#questDetail').show();
  });
  

  如果需要在初始化和绘制汇总表后立即更新详细信息，请使用选项定义回调并在那里执行

---

如果屏幕上看不到带有

数据catid=“9”

的按钮，即在第2页上，您想在加载数据或用户转到第2页时触发单击吗？同样重要的是要了解如何附加click事件处理程序。这是第2页的一个好问题，尽管分页是客户端的。基本上这个页面有两个数据表，一个是汇总表，另一个是详细表，其中一个或另一个显示。如果单击汇总表行，将打开该类别的详细信息。我正在尝试这样做，当用户从其他地方返回此页面时，如果他们最后一次查看详细信息面板，则将显示该面板。我将编辑我的问题以显示单击事件处理程序。非常感谢-我还有一个问题，就是在var btn=行中，我想为data catid分配一个变量值，因此data catid=myvar而不是data catid=“9”，但我似乎找不到正确的语法。您能提供建议吗？所有按钮上都已设置数据catid属性。我需要jquery来获取带有数据catid=myvar的按钮。最后一个项目符号显示了获取带有

data catid=“9”

的按钮的代码。如果类别ID在变量中，请使用

$（'#datatable summary'）.datatable（）.$（'button[data catid=“'+myvar+'”）

。这确实对我有帮助。

var btn = $('#datatable-summary').DataTable().$('button[data-catid="9"]').get(0);         
OnCategoryClick(btn);