Layui表格监听事件

开发工具与关键技术: Visual Studio   监听事件
作者:黎凤焕
撰写时间:2019年  7 月 2 日
 要实现Layui表格监听事件,首先引用Layui的CSS和JS进行引用。

在这里插入图片描述
在这里插入图片描述
使用lay-filter=””属性定义值,””里面自定义的值不可以重复,要唯一化,声明全局变量,在页面载入事件写监听事件。在控制器上将表格里的数据查询出来,写上链接。
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
当点击模态框为病人信息表格里行的数据时,外面的表格的数据自动填写。如果写的属性不是lay-filter=””,写错为layui-filter的效果是怎样的呢?而我把它写错为layui-filter了。当点击模态框为病人信息的行数据时,外面的表格显示为无数据,点击行数据时,监听效果不出来,数据显示不出来。
在这里插入图片描述
只有写lay-filter=””属性,监听事件才有效,写成layui-filter=””属性,监听事件使用不了,不出效果。

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Layui表格的翻页事件主要是通过监听table组件的page()方法实现的。当表格数据较多时,可以通过翻页来显示更多的数据内容,提高用户的浏览体验。 首先,在Layui表格的页面中,需要引入相应的Layui组件和JS文件,例如: ```html <script src="layui/layui.js"></script> ``` 其次,我们需要在JavaScript代码中定义翻页的事件处理函数。我们可以使用Layui的table组件的on()方法来监听翻页事件,例如: ```javascript layui.use('table', function () { var table = layui.table; table.on('page(test)', function (obj) { console.log(obj.curr); //当前页码 console.log(obj.limit); //每页显示的条数 console.log(obj.count); //总条数 //处理翻页事件的业务逻辑 }); }); ``` 在上述代码中,`test`代表的是table元素的lay-filter属性的值,`obj`是一个包含有关翻页状态的对象,可以通过`obj.curr`获取当前页码,`obj.limit`获取每页显示的条数,`obj.count`获取总条数。 最后,我们可以在翻页事件处理函数中添加自定义的业务逻辑。例如,可以根据页码和每页显示的条数,请求服务器获取对应的数据,并重新渲染表格内容。 这样,当用户点击表格的翻页按钮时,就会触发翻页事件,执行相应的业务逻辑,实现表格的翻页功能。 总结来说,Layui表格的翻页事件通过监听table组件的page()方法来实现,可以根据翻页事件获取当前页码、每页显示条数等信息,并进行相应的业务处理。这样可以方便地实现表格的翻页功能,提升用户的浏览体验。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值