使数据表行可单击

Question

我有一个表使用datatables.net通过ajax加载数据.我想这样做,以便当用户点击一行时,它链接到一个附加了该行主键的get变量的URL.

我是Datatables的新手,所以我的黑客尝试/想法是使用Datatables在我的主键两列中应用两个类.这两个类是hide(显示的css:none)和projectID(标识该列,因此我可以使用jquery获取它的值).我能够使用aoColumns属性应用这些类,它确实隐藏了列并附加了projectID类.但是我认为,因为Datatables正在创建表,所以它阻止我使用

$('#project-table tr').click(function(){alert('clicked');}

所以我试过了

$('#project-table tr').live('click',function(){alert('clicked');})};

也无济于事.

我想象有一个更好的方法,比我用来使行可点击,链接到一个带有附加主键获取变量的页面,但我找不到一个例子.如果任何人有一个示例的链接或可以指向我正确的方向,它将不胜感激.

Answer 1

我有一个表使用datatables.net通过ajax加载数据

这意味着在页面加载期间绑定到元素的任何事件处理程序将不适用于加载的数据,除非将事件委托给静态父元素 - 这意味着该元素永远不会被删除或替换,并且将无限期地存在.

$(document).on('click', '#project-table tr', function(){
    alert('This is a click on a dynamic element');
});

在这里,我们将click事件绑定到了document.如果您愿意,可以选择更接近的元素(用于提高性能).

这是.on()文档的链接

作为旁注 - 在jQuery 1.9 +中,删除了一些功能.其中一个是.live()函数,它已被.on()方法替换(如上所示).这就是为什么它不起作用.此外,console会告诉你这个.许多当前的浏览器都有自己的浏览器web inspector,否则您可以在浏览器中进行谷歌搜索并找到替代方案.