获取复选框的值:
(学习视频分享:javascript视频教程)
一、layui获取单个复选框的值
=========================================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;
登录后复制
二、layui获取多个复选框的值,并集中传给后台
//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>
登录后复制
那么怎么给layui复选框赋值呢?
layui.use('form', function () { form = layui.form; $('#AllDay').prop("checked", true); //先进行基本赋值 form.render(); //这句必须(用来更新渲染页面) });
登录后复制
推荐教程:layui
以上就是layui如何获取复选框的值以及如何为复选框赋值的详细内容,更多请关注Work网其它相关文章!