获取复选框值及回显

原创已于 2022-12-01 14:15:56 修改 · 1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #html

于 2022-11-10 12:56:45 首次发布

这段代码主要涉及HTML复选框的值获取、设置及回显功能。通过JavaScript遍历并检查复选框是否被选中，将选中值存储到数组，并能根据已有的值设置复选框的状态。此外，还定义了两个函数，'checkbox_val'用于获取选中复选框的值，'checkbox_fz'则用于根据数据回显复选框状态。

//获取复选框值
        var day = document.getElementsByName('day');
        var checkArr = [];
        for (k in day) {
            if (day[k].checked)
                checkArr.push(day[k].value);
        }
        console.log('checkArr', checkArr);

if (resData.riskFactorRepeated) {
    var checkArray = resData.riskFactorRepeated.split(",");
    var checkBoxAll = $("input[name='riskFactorRepeated']");
    for (var i = 0; i < checkArray.length; i++) {
        //获取所有复选框对象的value属性，然后，用checkArray[i]和他们匹配，如果有，则说明他应被选中
        $.each(checkBoxAll, function (j, checkbox) {
            //获取复选框的value属性
            var checkValue = $(checkbox).val();
            if (checkArray[i] == checkValue) {
                $(checkbox).attr("checked", true);
            }
        })
    }
}

//复选框操作 获取选中值
function checkbox_val(data) {
    var arr1 = new Array();
    $('input:checkbox[name=YS_JWBS]:checked').each(function (i) {
        arr1[i] = $(this).val();
    });
    data.YS_JWBS = arr1.join(',');

    var arr2 = new Array();
    $('input:checkbox[name=YS_YC]:checked').each(function (i) {
        arr2[i] = $(this).val();
    });
    data.YS_YC = arr2.join(',');

    var arr3 = new Array();
    $('input:checkbox[name=YS_JQHP_Y]:checked').each(function (i) {
        arr3[i] = $(this).val();
    });
    data.YS_JQHP_Y = arr3.join(',');
}

//复选框操作 回显
function checkbox_fz(data) {
    if (data.YS_JWBS != null) {
        var YS_JWBS = data.YS_JWBS.split(',');
        $('input:checkbox[name=YS_JWBS]').each(function (i) {
            if (YS_JWBS.indexOf(this.value) !== -1) {
                $(this).prop('checked', true);
            } else {
                $(this).prop('checked', false);
            }
        })
    }
    if (data.YS_YC != null) {
        var YS_YC = data.YS_YC.split(',');
        $('input:checkbox[name=YS_YC]').each(function (i) {
            if (YS_YC.indexOf(this.value) !== -1) {
                $(this).prop('checked', true);
            } else {
                $(this).prop('checked', false);
            }
        })
    }
    if (data.YS_JQHP_Y != null) {
        var YS_JQHP_Y = data.YS_JQHP_Y.split(',');
        $('input:checkbox[name=YS_JQHP_Y]').each(function (i) {
            if (YS_JQHP_Y.indexOf(this.value) !== -1) {
                $(this).prop('checked', true);
            } else {
                $(this).prop('checked', false);
            }
        })
    }
}