layui数据表格重载之后，表头工具栏按钮失效

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了layui数据表格重载之后，表头工具栏按钮失效，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1335字，纯文字阅读大概需要2分钟。

内容图文

原文链接：https://blog.csdn.net/Fly_1213/article/details/99708034

点击事件委托参考文章

问题：初次加载头部工具栏【删除所选班级】按钮功能都正常，但是在搜索 、修改、删除[都会执行一次表格重载获取新的数据] 之后 ，头部工具栏的按钮就失效了，怎么点击都无效！但是刷新一次页面之后又会生效。但是一执行重载之后又失效了！

原因：是因为工具栏的按钮是后期渲染出来的，所以第一次载入页面按钮事件是生效的，但是重载之后按钮也会重新加载。这时候按钮就变成未来元素了。这时候按钮就会捕捉不到click操作。

解决办法：此时只要换成点击事件委托就行了！无论重载多次都不会失效！

// 使用点击事件委托
// $('父元素').on('事件名','哪个子元素触发',传给回调函数的参数，事件触发时的回调函数);
$('body').on('click', '#batchremove', function() {
	// xxxxx
}

解释：

参数1（必须）：事件名，代表要绑定什么事件，但是记得不用加on，也就是说如果你想加点击事件，只要写’click’即可，注意是字符串！所以要打单引号或者双引号
参数2（可选）：只能由哪个子元素触发，例如我写 “li”，就代表只能由这个父元素里面的li触发事件，其他子元素不会触发。需要注意的是，这也是字符串，并且，参数2可以不写，那就代表仅仅只是给父元素加一个点击事件，并且所有子元素都能触发到这个事件（因为事件冒泡）
参数3（可选）：其实一般不会用，就是如果想事件触发时，自己给回调函数传一些值就写，这个参数也可以不写！
参数4（必须）：事件触发时的回调函数
总结：参数1和参数4是必须的，其他是可选的，如果你要用事件委托，请写上参数2　

如图所示：

 

 

 

 

内容总结

以上是互联网集市为您收集整理的layui数据表格重载之后，表头工具栏按钮失效全部内容，希望文章能够帮你解决layui数据表格重载之后，表头工具栏按钮失效所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

---