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

 更新时间:2019年09月06日 09:52:15   作者:Q-u-a-n  
今天小编就为大家分享一篇在layui下对元素进行事件绑定的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

要注意的是记得要先引用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下对元素进行事件绑定的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 基于leaflet.js实现修改地图主题样式的流程分析

    基于leaflet.js实现修改地图主题样式的流程分析

    这篇文章主要介绍了基于leaflet.js实现修改地图主题样式的流程,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-05-05
  • Three.js实现简单3D房间布局

    Three.js实现简单3D房间布局

    这篇文章主要为大家详细介绍了Three.js实现简单3D房间布局的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-12-12
  • Layui数据表格之单元格编辑方式

    Layui数据表格之单元格编辑方式

    今天小编就为大家分享一篇Layui数据表格之单元格编辑方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-10-10
  • 弹出窗口并且此窗口带有半透明的遮罩层效果

    弹出窗口并且此窗口带有半透明的遮罩层效果

    这篇文章主要介绍了如何点击一个按钮实现弹出一个居中窗口,并且此窗口带有半透明的遮罩层效果,需要的朋友可以参考下
    2014-03-03
  • javascript实现的图片预览和上传功能示例【兼容IE 9】

    javascript实现的图片预览和上传功能示例【兼容IE 9】

    这篇文章主要介绍了javascript实现的图片预览和上传功能,结合实例形式分析了javascrpt图片预览和上传功能相关实现技巧与操作注意事项,需要的朋友可以参考下
    2020-05-05
  • JS实现在页面随时自定义背景颜色的方法

    JS实现在页面随时自定义背景颜色的方法

    这篇文章主要介绍了JS实现在页面随时自定义背景颜色的方法,实例分析了javascript操作css样式的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-02-02
  • 全面解析JavaScript中“&&”和“||”操作符(总结篇)

    全面解析JavaScript中“&&”和“||”操作符(总结篇)

    这篇文章主要介绍了全面解析JavaScript中“&&”和“||”操作符(总结篇)的相关资料,需要的朋友可以参考下
    2016-07-07
  • javascript发送短信验证码实现代码

    javascript发送短信验证码实现代码

    我们在注册账号,或者是参加活动时,都会向手机发送收短信验证码,短信验证码到底是如何实现的,本文为大家揭晓,并为大家分项1javascript发送短信验证码实现代码,感兴趣的小伙伴们可以参考一下
    2015-11-11
  • 深入理解redux之compose的具体应用

    深入理解redux之compose的具体应用

    这篇文章主要介绍了深入理解redux之compose的具体应用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-01-01
  • es6 symbol的实现方法示例

    es6 symbol的实现方法示例

    这篇文章主要介绍了es6 symbol的实现方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04

最新评论