我有以下(简化的)JQuery代码:
$(document).ready(function() {
var table = $('#bot_table').DataTable( {
"ajax": "/static/Dashboard/pos.txt",
"paging": false,
"searching": false,
"columns": [
{ "data": "name_of_instance"},
{ "data": "bt" },
{ "data": "updated" },
{ "data": "pos" },
{ "data": "l_s" },
{ "data": "l_t" },
{ "data": "p_l" },
{
"className": 'details-control',
"orderable": false,
"data": null,
"defaultContent": ''
}
],
} );
$("td").html(function(){
var elem = $(this).html().replace("DELETE INSTANCE", "<button id = \"gen_del_instance\" type=\"button\" class=\"btn\"><span class=\"glyphicon glyphicon-trash\"></span> <u>DELETE INSTANCE</u></button>")
return elem
});
一想到,加载DataTable
后,下面的选择器将找到字符串的任何实例,并用一个按钮替换它。
但这不起作用。只有在alert()
之前的$("td")
之前,它才有效。选择器。
我的理解是,DOM
调用后DataTable()
未更新,并且在alert()
之后被强制更新。
有没有办法实现我想要的行为?
答案 0 :(得分:0)
解决方案是:
var table = $('#bot_table').DataTable( {
"ajax": "/static/Dashboard/positions.txt",
"paging": false,
"searching": false,
"columns": [
{ "data": "name_of_instance",
"render": function ( data, type, row ) {
var new_data = data.replace("DELETE INSTANCE", "<button id = \"gen_del_instance\" type=\"button\" class=\"btn\"><span class=\"glyphicon glyphicon-trash\"></span> <u>DELETE INSTANCE</u></button>");
return new_data;
}},
{ "data": "bot" },
{ "data": "updated" },
{ "data": "position" },
{ "data": "l_s" },
{ "data": "l_t" },
{ "data": "p_l" },
{
"className": 'details-control',
"orderable": false,
"data": null,
"defaultContent": ''
}
],
} );
谢谢@charlietfl