layui复选框根据后台参数值设置默认选中checked

前言

本文介绍layui复选框如何根据该参数给定的值来给checkbox设置默认值，步骤非常简单。

操作

效果如下，刚进入页面时根据参数的值，默认选中

复选框代码

<div class="layui-form-item">
        <label class="layui-form-label">难易级别</label>
        <div class="layui-input-block">
            <input type="checkbox" name="level"   value="1" title="一级">
            <input type="checkbox" name="level"   value="2" title="二级">
            <input type="checkbox" name="level"   value="3" title="三级">
            <input type="checkbox" name="level"   value="4" title="四级">
            <input type="checkbox" name="level"   value="5" title="五级">
        </div>
    </div>

向后台发送ajax请求获取该参数的值，并设置默认值

        var form = layui.form;
        var $ = layui.jquery
        $(document).ready(function(){
            var id = $('#id').val();
            $.ajax({
                type: "POST",
                url: "reviewCheckBox?id="+id,
                dataType: "json",
                cache: false,
                async: false,
                success : function(data) {
                    //给难易程度赋值并设置默认选中
                    var levelType=[];
                    levelType=data.result.level.split(",");
                    for(var j=0;j<levelType.length;j++){
                        var levelTypeCheckbox=$("input[name='level']");
                        for(var i=0;i<levelTypeCheckbox.length;i++){
                            if(levelTypeCheckbox[i].value==levelType[j]){
                                levelTypeCheckbox[i].value=levelType[j];
                                levelTypeCheckbox[i].checked=true;
                            }
                        }
                        form.render();  //更新渲染
                    }
                },
            });
        });

上述步骤即可给layui的checkbox赋默认值，if判断条件时，根据情况（levelTypeCheckbox[i]）选择title或者value来进行对比，然后进行赋值。