一、Layui Checkbox的基本用法
layui.use('form', function(){
  var form = layui.form;
  
  //监听提交
  form.on('submit(formDemo)', function(data){
    layer.msg(JSON.stringify(data.field));
    return false;
  });
});
Layui的Checkbox组件是一种常见的多选框控件,适用于多选情况。其基本用法非常简单,只需调用form.render()方法即可。同时,其与表单提交的联动使用也可以非常好地完成。
二、Layui Checkbox的选中触发事件
layui.use('form', function(){
  var form = layui.form;
  
  form.on('checkbox', function(data){
    console.log(data.elem); //得到checkbox原始DOM对象
    console.log(data.elem.checked); //是否被选中,true或者false
    console.log(data.value); //复选框value值,也可以通过data.elem.value得到
    console.log(data.othis); //得到美化后的DOM对象
  });  
});
Layui Checkbox支持选中触发事件,通过form.on(‘checkbox’, function(data){})来监听checkbox的勾选状态。在此方法中,可以获取到checkbox原始的DOM对象、value值、选中状态以及美化后的DOM对象等信息。
三、Layui Checkbox的选中触发事件应用场景
Checkbox的选中触发事件可以灵活地应用于各种场景,例如根据选中状态动态显示或隐藏其他元素,或者其他与checkbox有关的逻辑判断。下面我们将几个典型的场景进行详细讲解。
四、根据选中状态动态显示或隐藏其他元素
//html代码原创文章,作者:小蓝,如若转载,请注明出处:https://www.506064.com/n/189646.html
 
 微信扫一扫
微信扫一扫  支付宝扫一扫
支付宝扫一扫 