这是我的 Jquery 数据表,用于从 ajax 获取值并将其放置。
$(document).ready(function() {
$('#example').DataTable({
"ajax": "data/arrays.txt"
});
});
这是构建的表格。
我想给它写点击功能。我该怎么做 ?
<table id="example" class="table dataTable no-footer" role="grid" aria-describedby="example_info" style="width: 299px;">
<tbody>
<tr role="row" class="odd">
<td class="sorting_1">TMB030</td>
<td>Sample Collected</td>
</tr>
<tr role="row" class="even">
<td class="sorting_1">TMB033</td>
<td>Sample Collected</td>
</tr>
</tbody>
</table>
我想将点击事件写入 role="row"并获取其值 TMB030
。
我该怎么做?
我试过这样
$(document).ready(function() {
$('#example').DataTable({
"ajax": "myOrders/" + Cookies.get('userSession')
});
$("div[role='row']").click(function() {
alert('clicked')
});
});
但它没有被触发我该怎么做?请帮忙
最佳答案
应该是这样的:
$( document ).on("click", "tr[role='row']", function(){
alert($(this).children('td:first-child').text())
});
简要说明:
- 初始页面加载时(即执行
document.ready
回调函数时),数据表元素(行和列等)尚未出现在 DOM 树中。它们是在运行时响应数据更改而创建的。因此,document.click
方法中提供的回调函数不会绑定(bind)到任何元素(即div[role='row']
)。 - 为了克服它,
.on
方法可用。它将回调函数绑定(bind)到 DOM 中已有元素的点击事件以及动态创建的元素。
关于javascript - 将点击事件添加到数据表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37316811/