1

添付されているすべてのチェックボックスを選択するjQuery関数を作成しようとしています。これは私が取り組んできたコードです。私は何が間違っているのですか？ 

<div id=checkboxes>
<input type="checkbox" onclick="toggleChecked(this.checked)"> Select / Deselect All<br>
<input type="checkbox" />Eggs<br>
<input type="checkbox" />Butter<br>
<input type="checkbox" />Milk<br>
<input type="checkbox" />Bread<br>
<input type="checkbox" />Jam<br>
<input type="checkbox" />Tea<br>
</div>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">                
         function toggleChecked(status)
            $(document).ready(function(){
            $("#checkall").click(function(){
            var status = $(this).attr('checked');
            $('.checkbox').attr('checked',status);
            });
            });
</script>

PS：このコードをネットで見つけました。他のみんなのために働いているようだった。

4

7 に答える 7

2

多くの問題があります。クラスセレクターに基づいてチェックボックスを設定しようとしていますが、どのチェックボックスにもクラスがありません。また、document.ready関数はイベントハンドラー内にあり、その逆である必要があります...のprop()代わりにメソッドを使用してくださいattr()。そして、次のように、イベントを適切に添付します。

<div id=checkboxes>
<input id="checkall" type="checkbox"> Select / Deselect All<br>
<input class="checkbox" type="checkbox" />Eggs<br>
<input class="checkbox" type="checkbox" />Butter<br>
<input class="checkbox" type="checkbox" />Milk<br>
<input class="checkbox" type="checkbox" />Bread<br>
<input class="checkbox" type="checkbox" />Jam<br>
<input class="checkbox" type="checkbox" />Tea<br>
</div>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">                

     $(document).ready(function(){
         $("#checkall").on("click", function(){
             var status = $(this).is(":checked");
             $('.checkbox').prop('checked', status);
         });
     });

</script>
于 2012-07-06T06:47:19.957 に答える
1

関数の呼び出し中に中括弧が欠落していると思います...

 function toggleChecked(status)
    {
        $(document).ready(function(){
        $("#checkall").click(function(){
        var status = $(this).attr('checked');
        $('.checkbox').attr('checked',status);
        });
        });
     }
于 2012-07-06T06:45:34.700 に答える
1

取り外しonclickて作るonchange

于 2012-07-06T06:55:31.060 に答える
0

これを試して：

<div id=checkboxes>
<input type="checkbox" id="checkall"> Select / Deselect All<br>
<input type="checkbox" />Eggs<br>
<input type="checkbox" />Butter<br>
<input type="checkbox" />Milk<br>
<input type="checkbox" />Bread<br>
<input type="checkbox" />Jam<br>
<input type="checkbox" />Tea<br>
</div>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">                
            $(document).ready(function(){
              $("#checkall").click(function(){
                var status = $(this).attr('checked');
                $('input[type="checkbox"]').attr('checked',status);
              });
            });
</script>

これは、クリックイベントハンドラーを#checkall「load」の要素にバインドします。これは、必要なものであり、要素からjavascript onclick（）メソッドを削除します。また、セレクターを機能させるには、Selectall要素にIDを追加する必要がありました。

于 2012-07-06T06:45:20.960 に答える
0

または、これを行うことができます：

これを変える

<input type="checkbox" />

に

<input type="checkbox" class="checkbox"/>
于 2012-07-06T06:49:54.340 に答える
0

何らかの理由で、チェックボックスの属性値"true"とブール値trueが異なります。同様に"false"、ブール値falseは異なります。

これがそれを説明するフィドルです。ブール値falseをに変更してみてください"false"。そうすれば理解できます。

あなたの質問では、ステータス変数でブール値を受け取っていることを確認してください。

于 2012-07-06T06:53:06.613 に答える
-1

このリンクを確認してください。ここでは正常に機能しています。

于 2012-07-06T06:54:50.437 に答える