layui怎么实现列显示更多时触发table的事件
导读:本文共1635.5字符,通常情况下阅读需要5分钟。同时您也可以点击右侧朗读,来听本文内容。按键盘←(左) →(右) 方向键可以翻页。
摘要: 首先给这个下拉的图标添加一个mousedown的事件,记录当前的显示更多的是数据哪个表格的哪个tr的哪个td。然后记录在table._tableTrCurr下面。这个可能有的同学有疑问为啥不直接用click,这个是因为表格内部也做了一个事件委托,但是不是委托给document啥的而是委托给了table的body然后stope了也就是说实际上你外面再写委托到doc... ...
目录
(为您整理了一些要点),点击可以直达。首先给这个下拉的图标添加一个mousedown的事件,记录当前的显示更多的是数据哪个表格的哪个tr的哪个td。然后记录在table._tableTrCurr下面。
这个可能有的同学有疑问为啥不直接用click,这个是因为表格内部也做了一个事件委托,但是不是委托给document啥的而是委托给了table的body然后stope了也就是说实际上你外面再写委托到document。
点击监听的时候到table的逻辑之后就停了,不会走到你的监听里面,所以避开了它用了一个mousedown,那如果是移动端的会不会有什么问题和这个可以自己试试看,这里以web端为主。
然后是另外一个监听,就是监听打开的这个tips里面的“按钮”的click,然后找到刚才记录的那个_tableTrCurr信息,找到我们要的那个table的那个tr的那个td的那个按钮,找到了就好办了,直接click一下就能触发写的table.on('tool')的内容了。
注意:这个修改是在最新版本的基础上修改的(v2.4.5)里面有一个关键的就是获得表格的id,这个id不是单纯的是table节点的id,而是render出来之后这个实例的id。
如果不设置默认就是table的节点的id如果没有,table内部会生成一个index之类的作为这个table的id,在2.4.4更新中有一个可能大家不太容易注意到但是确实意义很大的修改,就是在table的view中添加了一个lay-id这个属性来保存当前的这个table的实例的id。
这个是非常非常非常好用的一个变化,意义很大的,后面你要reload某个table只要知道你reload的到底是哪个节点,自然就能够找到你要reload的tableId是什么。所以强烈的建议如果还在使用2.4.0~2.4.3的小伙伴还是升级成2.4.4+。
当然如果你使用了我那个tablePlug插件,实际可以不用担心这个问题,因为我在tablePlug内部就做了处理,如果render之后没有和这个lay-id会给添加上去,达到跟2.4.4+同样的效果。
实现代码如下:
layui怎么实现列显示更多时触发table的事件的详细内容,希望对您有所帮助,信息来源于网络。