1

これがjsfiddle http://jsfiddle.net/6mk7m/9/です

stackoverflow で jsfiddle アカウントを作成する必要があることがわかりました。そうすれば、読みやすいようにコードをお見せすることができます (申し訳ありません)。

私は現在jQueryを学んでいますが、私は専門家ではなく、単なる「初心者」です。とにかく、

チェックボックスを作成し、それに id = all を指定しました

<input type="checkbox" id="all" /><span style='color:red'>All</span>

単に私が欲しいのは、この特定のIDでこのチェックボックスをクリックすると、以下にリストされているこれら3つのチェックボックスをチェックしたいだけです

<input type="checkbox" name="us[]" value="google" />Google
<input type="checkbox" name="us[]" value="youtube" />Youtube
<input type="checkbox" name="us[]" value="friend" />Friend<br/><br/>

これは私がどのように考え出したコードか、

<script type="text/javascript">

$("document").ready(function() {


    $("input[id='all']").bind('click',function(){

        var all = $(this);

        console.log('status: ' + all.prop('checked'));


        if(all.prop('checked') == true)
        {
            //alert('now its true');
            $("input:checkbox").attr("checked","checked");
        }
        else if (all.prop('checked') == false){
            $("input:checkbox").removeAttr("checked");
        }

    })
})  
 </script>

id = all のチェックボックスをクリックすると (すべてのチェックボックスが選択されます)

id = all のチェックボックスを 2 回目にクリックすると (すべてのチェックボックスがオフになります)

すべては今までの挨拶です

id = allのチェックボックスを3回クリックすると問題が発生します

（チェックボックスはチェックされません）ただし、コンソールをチェックすると、すべての属性がチェックされていることがわかります-しかし、ブラウザでチェックされていないチェックボックスが表示されます。つまり、中央にこのチェックマークがないチェックボックスを意味します各ボックスのコードに何か問題がある可能性があります.3回以上クリックしたいときに機能しない理由がわかりません。

4

5 に答える 5

3 
$(document).ready(function() {
    $('#selecctall').click(function(event) {  //on click 
        if(this.checked) { // check select status
            $('.checkbox1').each(function() { //loop through each checkbox
                this.checked = true;  //select all checkboxes with class "checkbox1"               
            });
        } else {
            $('.checkbox1').each(function() { //loop through each checkbox
                this.checked = false; //deselect all checkboxes with class "checkbox1"                       
            });         
        }
    });
});
于 2014-09-04T10:18:53.390 に答える
2 
$('#all').on('click', function(){
    $('input:checkbox[name="us[]"]').prop('checked', this.checked);
});
于 2013-04-20T12:57:38.767 に答える
2

これは、正しい動作の jsFiddle です。jQuery の最新バージョンでは、(属性ではなく) 要素のプロパティを変更するには、コマンド prop() を使用する必要があります。

http://jsfiddle.net/6mk7m/10/

以下のコードを参照してください。

    if(all.prop('checked') == true)
    {
        //alert('now its true');
        $("input:checkbox").prop("checked",true);
    }
    else if (all.prop('checked') == false){
        $("input:checkbox").prop("checked",false);
    }
于 2013-04-20T12:50:52.820 に答える
0

なぜそれを超単純にしないのですか：

$('#all').on("change",function(){
    $('input:checkbox').not('#all').each(function(a,b){
           var _checked=$('#all').is(":checked");
          $(b).prop('checked',_checked)
        });
});

このフィドルを参照してください

于 2013-04-20T12:55:21.817 に答える
0

この方法を試してください-

働くフィドル

$("input[id='all']").bind('click',function(){
        var all = $(this);
        console.log('status: ' + all.prop('checked'));
        if(all.is(':checked')){
            //alert('now its true');
            $("input:checkbox[name^='us']").prop("checked",true);
        }
        else{
            $("input:checkbox[name^='us']").prop("checked",false);
        }
});
于 2013-04-20T12:48:19.483 に答える