0

我正在编写一个脚本，用于根据存储在数组中的值设置复选框（允许用户将表单恢复为其初始值的较大脚本的一部分）。代码基本上是这样的：

$("#myForm :checkbox[name='myName[]']").each(function(){
    if($.inArray($(this).val(),initValues)!=-1){
        $(this).prop("checked",true);
    } else {
        $(this).prop("checked",false);
    }
});

initValues 包含最初选中的框的值属性。

该脚本检查第一个元素，$("#myForm :checkbox[name='myName[]']")但后续元素似乎都未选中。Firebug 显示该checked属性正在更改，但该框本身未选中。

我已经尝试了非常多的排列来attr()代替prop()所有结果，并且脚本在 OS X 上的 Firefox 11.0 和 Chrome 18.0 中的行为方式相同。

4

3 回答 3

2 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var initValues = ['eee', 'mec', 'csc'];

            $('#btnResetCheckBox').click(function () {
                $('#myForm').find(':checkbox[name^="myName"]').each(function () {
                    $(this).prop("checked", ($.inArray($(this).val(), initValues) != -1));
                });

                //Or 

                //                $('#myForm').find(':checkbox[name^="myName"]').prop('checked', false);
                //                $.each(initValues, function (i, val) {
                //                    $('#myForm').find(':checkbox[name^="myName"][value="' + val + '"]').prop("checked", true);
                //                });
            });

            $('#btnResetCheckBox').trigger('click');
        });
    </script>
</head>
<body>
    <form id="myForm" action="">
    <div>
        <input type="checkbox" name="myName[1]" value="eee" />eee<br />
        <input type="checkbox" name="myName[2]" value="ece" />ese<br />
        <input type="checkbox" name="myName[3]" value="it" />it<br />
        <input type="checkbox" name="myName[4]" value="csc" />csc<br />
        <input type="checkbox" name="myName[5]" value="mec" />mec<br />
    </div>
    <input type="button" id="btnResetCheckBox" value="Reset Check Box" />
    </form>
</body>
</html>
于 2012-04-25T11:55:39.470 回答
2

还有另一种方法。如果您为每个复选框提供相同的类，您实际上可以将一个数组传递给该类的 .val 。

jQuery(".nameInput").val(initValues);

它简单、优雅且有效

于 2019-11-21T20:37:07.540 回答
0

如果未设置为字符串，则 html 属性可能会混乱。

我建议更换：

$(this).prop("checked",true);

经过

$(this).prop("checked","checked");

或者

$(this).prop("checked",false);

经过

$(this).prop("checked","");
于 2012-04-25T12:07:08.087 回答