Home >Web Front-end >Layui Tutorial >How layui gets the value of the checkbox and how to assign a value to the checkbox
Get the value of the check box:
(Learning video sharing: javascript video tutorial)
1. Get layui The value of a single check box
=========================================HTML============================================= <div class="layui-form-item"> <div class="layui-col-md12"> <div> <label class="layui-form-label">类型</label> <div class="layui-input-block"> <input type="checkbox" name="AllDay" id="AllDay" lay-filter="test1" value="全天" title="全天"> <input type="checkbox" name="IsEnd" id="IsEnd" lay-filter="test1" value="结束时间" title="结束时间"> </div> </div> <span></span> </div> </div> ========================================JS============================================= var allDayCheck = document.getElementById("AllDay").checked; var isEndCheck = document.getElementById("IsEnd").checked;
2. Layui obtains the values of multiple check boxes and centrally transmits them to the background
//HTML代码 <form class="layui-form"> <div class="layui-form-item"> <label class="layui-form-label">复选框</label> <div class="layui-input-block"> <input type="checkbox" name="like" value="1" title="写作"> <input type="checkbox" name="like" value="2" title="阅读" > <input type="checkbox" name="like" value="3" title="发呆"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> //JS代码 <script> layui.use('form', function(){ var form = layui.form; form.on('submit(formDemo)', function(data){ //获取checkbox[name='like']的值 var arr = new Array(); $("input:checkbox[name='like']:checked").each(function(i){ arr[i] = $(this).val(); }); data.field.like = arr.join(",");//将数组合并成字符串 $.post("admin.php", {data:data.field}, function (res) { if (res.code == 1) { layer.msg(res.msg, {time: 1800, icon: 1}, function () { location.href = res.url; }); } else { layer.msg(res.msg, {time: 1800, icon: 2}); } }, 'json'); return false; }); }); </script>
So how to assign values to the layui check boxes?
layui.use('form', function () { form = layui.form; $('#AllDay').prop("checked", true); //先进行基本赋值 form.render(); //这句必须(用来更新渲染页面) });
Recommended tutorial: layui
The above is the detailed content of How layui gets the value of the checkbox and how to assign a value to the checkbox. For more information, please follow other related articles on the PHP Chinese website!