4

チェックボックスのコントロール配列を使用して複数選択をキャプチャしています

次のコードは、2 つのチェックボックスを使用して適切に動作し、期待どおり に値2を返します(または、多くの場合)。

ただし、配列にチェックボックス項目が 1 つしかない場合、長さ0 (ゼロ)が返されます....なぜでしょうか? 長さ 1 を返すべきではありませんか?

これを Internet Explorer と Chrome で試しましたが、結果は同じでした。回避策として、コードを実行するときに常に 2 つ以上の項目があることを確認するために、配列に非表示の偽のチェックボックスを含める必要があります。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
    <title></title>
    <script language="javascript" type="text/javascript">
        function categoryOnClick() {
            var selectedRows = document.searchForm.elements['categorySelect[]'];
            alert(selectedRows.length);
        }
    </script>
</head>
<body>
    <form name="searchForm" action="">
        <input type="checkbox" name="categorySelect[]" id="1" onclick="categoryOnClick();"/>
        <input type="checkbox" name="categorySelect[]" id="2" onclick="categoryOnClick();"/>
    </form>
</body>
</html>

0 (ゼロ) の長さを返すコード...

<form name="searchForm" action="">
     <input type="checkbox" name="categorySelect[]" id="1" onclick="categoryOnClick();"/>
</form>
4

3 に答える 3

1

JavaScriptでできること

function categoryOnClick() {
    var count = document.querySelectorAll("input[type=checkbox]").length;
    var checkedElements = 0;
    for (var i = 0; i < count; i++) {
        checkedElements = checkedElements + parseInt((document.querySelectorAll("input[type=checkbox]")[i].checked) ? 1 : 0);    
    }
    alert(checkedElements);
}

そしてjqueryで：

function categoryOnClick() {           
    alert($('input:checked').length)
}

それが役立つことを願っています

于 2013-06-20T12:34:44.280 に答える
0

jQuery を使用してこれを行うことができます。

function categoryOnClickjQuery() {
    var selectedRows = $('form input').attr('name', 'categorySelect[]');
    alert(selectedRows.length);
}
于 2013-06-20T12:25:42.567 に答える