将点击事件添加到数据表

这是我的Jquery数据表，用于从ajax获取值并放置它。

$(document).ready(function() { $('#example').DataTable({ "ajax": "data/arrays.txt" }); }); 

这是构造的表格。

我想写点击function。 我该怎么做 ？

 
 
 
 
TMB030
 
Sample Collected
 
 
 
TMB033
 
Sample Collected
 
 
  

我想将click事件写入role =“row”并获取值TMB030 。

我怎样才能做到这一点 ？

我试过这样的

 $(document).ready(function() { $('#example').DataTable({ "ajax": "myOrders/" + Cookies.get('userSession') }); $("div[role='row']").click(function() { alert('clicked') }); }); 

但它没有触发我怎么能这样做？ 请帮忙

Answer 1

它应该是这样的：

 $( document ).on("click", "tr[role='row']", function(){ alert($(this).children('td:first-child').text()) }); 

简要说明：首先，在DOM中不存在应用click事件的元素，即div[role='row'] 。 其次，你必须动态绑定click事件，因为你绑定click事件的时间， DataTable没有完全加载，并且你还没有应用click事件的元素。

Answer 2

将您的点击更改为：

  $( "tr[role='row']" ).on("click",function(){ alert($(this).find("td:first-child").text()); }); 

样品：

 $(document).ready(function() { $("tr[role='row']").on("click",function() { alert($(this).find("td:first-child").text()); }); }); 

  
 
 
 
TMB030
 
Sample Collected
 
 
 
TMB033
 
Sample Collected
 
 
  

Answer 3

如果您通过ajax加载表，也许最好使用dataTable的函数“initComplete”，那么当您完全确定所有行都存在时，您可以将事件绑定到表中的任何元素。

 $('#example').DataTable({ "ajax": "myOrders/" + Cookies.get('userSession'), "initComplete": function () { $( document ).on("click", "tr[role='row']", function(){ alert($(this).children('td:first-child').text()) }); } }); 

Answer 4

.click事件不会绑定动态元素，在你的情况下，行将在ajax调用后加载。

所以将代码更改为以下

 $("tr[role='row']" ).on('click', function(){ alert('clicked') }); 

Answer 5

试试吧：

 $( document ).on("click", "#example tr[role='row']", function(){ alert($(this).children('td:first-child').text()) });