对layui中表单元素的使用详解
首先不管是单选框还是复选框或者是下拉框，都要在你写的标签外面套一层div或者是form标签，如：
<div class="layui-input-block"> <input type="radio" name="sex" value="0" title="男"> </div>，class属性是固定写法。
这样写好了以后，你如果是写在静态页面，这样式可以看见效果，如果写在js里，这样写了还有一步得写，那就是
var form = layui.form();
form.render("select"); //更新全部
这样写是外面套的是form标签，如果是div，就写layui.div();即可。
对于下拉框的事件的使用，语法form.on('event(过滤器值)', callback);
也可写成
var form=layui.form();
form.on('select(addywlb)', function(data){}),这里面的选中的值可以直接data.value;关于data里的数据结构，感兴趣可以console.log(data);打印出看看。获取选中的其他的属性值，和普通的用法一样，$("#cxYearBegin option:selected").attr("year");对了，关于select()括号里的值是这样来的 <select name="modules" lay-verify="required" lay-filter="cxYearBegin" lay-search="" id="cxYearBegin" >，根据这个lay-filter属性来获取。
如果是复选框的事件，就可以这样写
form.on('checkbox(filter)', function(data){});
如果是单选按钮是这样写：
form.on('radio(filter)', function(data){});
如果是开关按钮，事件是一样的：
form.on('switch(filter)', function(data){});
其中括号里的值都是通过lay-filter这个属性值来获取。
以上这篇对layui中表单元素的使用详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
下面小编就为大家分享一篇js原生方法被覆盖,从新赋值原生的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-01-01
在本篇文章里小编给大家整理的是一篇关于js中hasOwnProperty的属性及实例用法详解内容，有需要的朋友们可以跟着学习下。2021-11-11
最近工作中element后台管理使用Echarts图表,在使用过程中也遇到了些问题,下面这篇文章主要给大家介绍了关于echart自适应宽度的两种方法,需要的朋友可以参考下2022-12-12
这篇文章主要介绍了JavaScript将取代AppleScript？AppleScript是OS X平台的类似JavaScript的脚本语言,需要的朋友可以参考下2014-09-09
原生JS版和jquery版实现checkbox的全选/全不选/点选/行内点选(Mr.Think)
脚本之家小编之前整理不少checkbox全选全不选这方便的文章，但看了这篇以后发现实现方法更好2016-10-10
限制文本框只能输入数字||只能是数字和小数点||只能是整数和浮点数
这篇文章主要介绍了限制文本框只能输入数字||只能是数字和小数点||只能是整数和浮点数的实例代码，非常不错，也比较实用，需要的小伙伴一起看下吧2016-05-05
对已声明但未初始化的和未声明的变量执行typeof，都返回undefined，null表示一个空对象指针，typeof操作会返回object2014-09-09
这篇文章主要介绍了webpack中的模式(mode)使用详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-02-02
《javascript设计模式》学习笔记三：Javascript面向对象程序设计单例模式原理与实现方法分析
这篇文章主要介绍了Javascript面向对象程序设计单例模式原理与实现方法,结合实例形式分析了《javascript设计模式》中Javascript面向对象单例模式相关概念、原理、用法及操作注意事项,需要的朋友可以参考下2020-04-04
本文主要介绍了javascript将字符串中的每一个单词的首字母变为大写其余均为小写的方法。具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
最新评论