[英]Toggle not working with DataTable responsive
This is how I am coding: 这是我编码的方式:
$(document).ready(function () {
$("[id^=btnToggle]").click(function () {
$('#infoToggle' + this.id.match(/\d+$/)[0]).toggle();
});
$('#dataTables-example').DataTable({
responsive: true
});
});
Here this code $("[id^=btnToggle]")
is not working, but when I remove $('#dataTables-example')
it is working fine. 这里的代码
$("[id^=btnToggle]")
不起作用,但是当我删除$('#dataTables-example')
它工作正常。
I tried reversing their positions, I tried using separate document ready function, it did not work. 我试图调换他们的位置,我尝试使用单独的文档准备功能,但是没有用。
Please let me know how to fix this? 请让我知道如何解决此问题?
Thanks 谢谢
The dom( #dataTables-example
) is modified when after calling the datatable event. 调用datatable事件后,将修改dom(
#dataTables-example
)。 due to which inner elements no more have previously attached events .You need to use event delegation in this case: 由于哪些内部元素不再具有以前附加的事件。在这种情况下,您需要使用事件委托:
$("body").on('click','[id^=btnToggle]',function () {
$('#infoToggle' + this.id.match(/\d+$/)[0]).toggle();
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.