1

I have this Jquery:

$(document).ready(function() {
   $('#masterChecks input[type="checkbox"]').click(function() {
   var togClass=$(this).attr('class');
   if($(this).attr('checked')){

    //need to make sure all checkboxes for this class is checked, when the
    //master checkbox is checked.
    $('div.' + togClass ).css("display", "inline-block");
}
else
{
        //need to make sure all checkboxes for this class is unchecked, when the
    //master checkbox is checked.
    $('div.' + togClass ).css("display", "none");

}
});

});

I have Html with many divs, and many classes. There are many checkboxs. Now i am checking the mastercheckbox, which will hide the css of all attributes that have the same class as the checkbox. I also have a set of local checkboxes which do the same but only for the div they are in. I want the Jquery uncheck the local checbox with the same class when it is unchecked, and vice versa. here is the html struccture

<div id="masterChecks">
   // checbox here with class="sampleclass"
</div>
 <div class="sampleclass">
      //local checkbox here 
 </div>

it seems very straight forward , but cant get it to work,

ive tried some things like this:

 $('div.' + togClass + 'input[type="checkbox"]').attr('checked','checked');

can anyone help?

4

4 に答える 4

2

jQuery.each()を見てください

すべてのチェックボックスを反復して、チェックされているかどうかを確認できる場所

于 2012-07-20T10:20:24.737 に答える
1

jquery 関数.is()を使用してチェックボックスのステータスを確認し、次に.each()関数を使用して、同じクラスのすべてのチェックボックスのステータスをマスターの 1 つに循環および設定できます。

$('#masterChecks input[type="checkbox"]').click(function(){
 var checkclass= $(this).attr('class');
if($(this).is(':checked'))
   $('div.' + checkclass + ' input[type="checkbox"]').each(function(){
       $(this).attr('checked', true);
   });
 else   
    $('div.' + checkclass + ' input[type="checkbox"]').each(function(){
        $(this).attr('checked', false);
   });
});

編集: 作業コードの jsfiddle を追加: http://jsfiddle.net/CFeam/2/

于 2012-07-20T10:19:49.573 に答える
0

試してみてください：

$('#masterChecks input[type="checkbox"]').click(function(){
var yourClass = $(this).attr('class');
if($(this).is(':checked'))
{
    $('div.' + yourClass + ' input[type="checkbox"]').each(function(){
        $(this).attr('checked', true);
    });
}
else
{
    $('div.' + yourClass + ' input[type="checkbox"]').each(function(){
        $(this).attr('checked', false);
    });
}
});​

ワーキングフィドル

于 2012-07-20T10:40:52.130 に答える
0

ドキュメント準備完了関数を置き換えるだけです:

    $(document).ready(function() {
       $('#masterChecks input[type="checkbox"]').click(function() {
       var togClass=$(this).attr('class');
       $(togClass).click(function(){
             if($('#masterChecks').is(':checked'){
                $('div.' + togClass ).css("display", "inline-block");
                $(togClass).each(function(){
                    $(this).attr('checked','checked');      
                });  
             }else{
                $('div.' + togClass ).css("display", "none");
                $(togClass).each(function(){
                    $(this).removeAttr('checked');      
                });  
             }
            });
        });        
    });
于 2012-07-20T10:44:50.127 に答える