在layui下对元素进行事件绑定的实例


Posted in Javascript onSeptember 06, 2019

要注意的是记得要先引用element操作模块 ,否则是无法绑定的

格式:

$(document).on(事件,标识,function(){});

layui.use(['jquery', 'form', 'table', 'element'], function() {
  var form = layui.form;
  var table = layui.table;
  var element = layui.element;
  var $ = layui.$;
 
 
  // form.render();
  table.render({
   elem: '#tableList',
   // height: 315,
   url: "{{route('admin.data')}}",
   page: true, //开启分页 
   cols: [
    [ //表头
     { field: 'id', title: 'ID', sort: true, fixed: 'left' },
     { field: 'name', title: '用户名' },
     { field: 'role', title: '角色', sort: true },
     {
      field: 'status',
      title: '状态',
      templet: function(d) {
       return d.status == 0 ? '禁止' : '启用'
      }
     },
     { field: 'created_at', title: '创建时间' },
     {
      title: '操作',
      // minWidth: 200,
      templet: function(d) {
       return '<button class="layui-btn layui-btn-xs " lay-filter="editF" id="edit" data-id="' + d.id + '">编辑</button>'
      }
     }
    ]
   ]
  });
  //绑定事件
  $(document).on('click', '#edit', function(data) {
   var id = $(this).attr('data-id');
 
  });
  });

以上这篇在layui下对元素进行事件绑定的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
firefox 和 ie 事件处理的细节,研究,再研究 书写同时兼容ie和ff的事件处理代码
Apr 12 Javascript
ASP.NET jQuery 实例5 (显示CheckBoxList成员选中的内容)
Jan 13 Javascript
js隐藏与显示回到顶部按钮及window.onscroll事件应用
Jan 25 Javascript
Javascript Ajax异步读取RSS文档具体实现
Dec 12 Javascript
利用JQuery和Servlet实现跨域提交请求示例分享
Feb 12 Javascript
JS实现淘宝支付宝网站的控制台菜单效果
Sep 28 Javascript
jquery实现删除一个元素后面的所有元素功能
Dec 21 Javascript
如何让一个json文件显示在表格里【实现代码】
May 09 Javascript
值得分享的bootstrap table实例
Sep 22 Javascript
详解vue+css3做交互特效的方法
Nov 20 Javascript
在ES5与ES6环境下处理函数默认参数的实现方法
May 13 Javascript
jQuery表单选择器用法详解
Aug 22 jQuery
Nuxt.js实现一个SSR的前端博客的示例代码
Sep 06 #Javascript
layui type2 通过url给iframe子页面传值的例子
Sep 06 #Javascript
使用layui的router来进行传参的实现方法
Sep 06 #Javascript
layui关闭弹窗后刷新主页面和当前更改项的例子
Sep 06 #Javascript
layui关闭层级、简单监听的实例
Sep 06 #Javascript
layui表格内容溢出的解决方法
Sep 06 #Javascript
layui表格 列自动适应大小失效的解决方法
Sep 06 #Javascript
You might like
收音机史话 - 1960年代前后的DIY
2021/03/02 无线电
咖啡语言
2021/03/03 咖啡文化
怎样在UNIX系统下安装php3
2006/10/09 PHP
PHP类的静态(static)方法和静态(static)变量使用介绍
2012/02/19 PHP
php 利用array_slice函数获取随机数组或前几条数据
2015/09/30 PHP
PHP的Yii框架中创建视图和渲染视图的方法详解
2016/03/29 PHP
thinkPHP框架中layer.js的封装与使用方法示例
2019/01/18 PHP
PHP addcslashes()函数讲解
2019/02/03 PHP
一个加载js文件的小脚本
2007/06/28 Javascript
javascript去掉前后空格的实例
2013/11/07 Javascript
jquery 中的each()跳出循环的语句
2014/05/23 Javascript
jQuery+html5+css3实现圆角无刷新表单带输入验证功能代码
2015/08/21 Javascript
JQuery插件Marquee.js实现无缝滚动效果
2016/04/26 Javascript
jQuery事件处理的特征(事件命名机制)
2016/08/23 Javascript
javascript 将共享属性迁移到原型中去的实现方法
2016/08/31 Javascript
JavaScript中Require调用js的实例分享
2017/10/27 Javascript
用最少的JS代码写出贪吃蛇游戏
2018/01/12 Javascript
JavaScript实现图片懒加载的方法分析
2018/07/05 Javascript
vue2.0+vue-router构建一个简单的列表页的示例代码
2019/02/13 Javascript
vue中实现点击变成全屏的多种方法
2020/09/27 Javascript
[23:18]Spirit vs Liquid Supermajor小组赛A组 BO3 第二场 6.2
2018/06/03 DOTA
python生成指定尺寸缩略图的示例
2014/05/07 Python
Python实现抓取页面上链接的简单爬虫分享
2015/01/21 Python
pyinstaller参数介绍以及总结详解
2019/07/12 Python
终于搞懂了Keras中multiloss的对应关系介绍
2020/06/22 Python
捷克汽车配件和工具销售网站:TorriaCars
2018/02/26 全球购物
上海雨人软件技术开发有限公司测试题
2015/07/14 面试题
运动会稿件300字
2014/02/14 职场文书
车辆年审委托书范本
2014/09/18 职场文书
基层党支部整改方案
2014/10/25 职场文书
乐山大佛导游词
2015/02/02 职场文书
公务员年度考核个人总结
2015/02/12 职场文书
2015年销售工作总结范文
2015/03/30 职场文书
药品销售内勤岗位职责
2015/04/13 职场文书
python 安全地删除列表元素的方法
2022/03/16 Python
剑指Offer之Java算法习题精讲二叉树专项训练
2022/03/21 Java/Android