layui给radio添加点击事件

最近做一个后台项目，用到了layui，需要设计一个单选按钮并且添加点击事件。参考了下官方文档 https://www.layui.com/doc/modules/form.html#onradio ，最终还是实现了这个效果。给layui一个好评，用layui来做后台管理系统确实不错。

html代码

<div class="layui-form-item" >
  <label class="layui-form-label"><span style="color: red">*</span>选择: </label>
       <div class="layui-input-inline" >
         <input type="radio" lay-filter="testRadio" lay-verify="required" name="state" value="pass" title="通过"  >
         <input type="radio" lay-filter="testRadio" lay-verify="required" name="state" value="reject" title="驳回">
       </div>
 </div>

js代码

form.on('radio(testRadio)', function(data){
    if(data.value == 'reject'){
            $("#resonDiv").css("display", "block");
        } else {
            $("#resonDiv").css("display", "none");
        }
});

文档中还有

　　初始赋值form.val('lay-filter的值', object);

　　表单验证

form.verify({
  username: function(value, item){ //value：表单的值、item：表单的DOM对象
    if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
      return '用户名不能有特殊字符';
    }
    if(/(^\_)|(\__)|(\_+$)/.test(value)){
      return '用户名首尾不能出现下划线\'_\'';
    }
    if(/^\d+\d+\d$/.test(value)){
      return '用户名不能全为数字';
    }
  }
  
  //我们既支持上述函数式的方式，也支持下述数组的形式
  //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
  ,pass: [
    /^[\S]{6,12}$/
    ,'密码必须6到12位，且不能出现空格'
  ] 
});

　　表单提交 form.on('submit(go)', callback);

　　复选框 form.on('checkbox(filter)', function(data){ doSomething(); });

　　等等。

来源：oschina

链接：https://my.oschina.net/u/4403186/blog/4534942

标签

layui

RED

javascript