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


    原文链接: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 

    如图所示:

     

  • 相关阅读:
    Java Gradle
    C/C++ C++11新特性
    C/C++ C++11原子类型和内存序
    基于流的编程(Flow-Based Programming)
    算法和数据结构 筛法求素数
    数据库 悲观锁和乐观锁
    数据库 事务隔离级别
    Serverless 的 AI 写诗,程序员浪漫起来谁能顶得住啊!
    亮点前瞻 | 首届 ServerlesssDays · China 大会议程发布
    腾讯云云函数 SCF Node.js Runtime 最佳实践
  • 原文地址:https://www.cnblogs.com/xi-li/p/14735117.html
Copyright © 2020-2023  润新知