zaznaczenie wszystkich pól wyboru jquery

Question

Dlaczego w moim kodzie js wystarczy jedno kliknięcie na name:check_all zaznaczenie wszystkich pól wyboru?

HTML:

<div id="ss"> 
    <input type="checkbox" name="check_all"> 
</div> 
<input type="checkbox" name="checked" class="idRow"> 
<input type="checkbox" name="checked" class="idRow"> 
<input type="checkbox" name="checked" class="idRow"> 
<input type="checkbox" name="checked" class="idRow"> 
<input type="checkbox" name="checked" class="idRow"> 
<input type="checkbox" name="checked" class="idRow"> 
<input type="checkbox" name="checked" class="idRow"> 
<input type="checkbox" name="checked" class="idRow"> 

jQuery:

$(document).on('click change','input[name="check_all"]',function() { 
    var checkboxes = $('.idRow'); 
    if($(this).is(':checked')) { 
     checkboxes.attr("checked" , true); 
    } else { 
     checkboxes.attr ("checked" , false); 
    } 
}); 

DEMO:http://jsfiddle.net/KdaZr/

Moja wersja jQuery 1.9.

Jak to naprawić?

Answer 1

Zastosowanie prop metodą. Kiedy twoje znaczniki są renderowane, stają się właściwościami elementów, używając JavaScript, powinieneś zmodyfikować właściwości elementu.

$(document).on('change','input[name="check_all"]',function() { 
    $('.idRow').prop("checked" , this.checked); 
}); 

http://jsfiddle.net/GW64e/

Zauważ, że jeśli input[name="check_all"] nie jest generowana dynamicznie, nie ma potrzeby, aby przekazać zdarzenie.

Answer 2

Użyj .prop, a nie .attr, aby zmienić właściwości elementów. .attr jest dla atrybutów HTML.

http://jsfiddle.net/KdaZr/1/

Answer 3

fix jest następująca: -

$(document).on('click change','input[name="check_all"]',function() { 
    var checkboxes = $('.idRow'); 
    if($(this).is(':checked')) { 
     checkboxes.each(function(){ 
      this.checked = true; 
     }); 
    } else { 
     checkboxes.each(function(){ 
      this.checked = false; 
     }); 
    } 
}); 

Answer 4

Kompletne rozwiązanie wybrać || odznacz pole wyboru jQuery:

$(document).ready(function() { 
    $("#checkedAll").change(function(){ 
    if(this.checked){ 
     $(".checkSingle").each(function(){ 
     this.checked=true; 
     })    
    }else{ 
     $(".checkSingle").each(function(){ 
     this.checked=false; 
     })    
    } 
    }); 

    $(".checkSingle").click(function() { 
    if ($(this).is(":checked")){ 
     var isAllChecked = 0; 
     $(".checkSingle").each(function(){ 
     if(!this.checked) 
      isAllChecked = 1; 
     })    
     if(isAllChecked == 0){ $("#checkedAll").prop("checked", true); }  
    } 
    else { 
     $("#checkedAll").prop("checked", false); 
    } 
    }); 
}); 

HTML powinny być:

pole pojedyncze na sprawdzonej wyboru będą trzy wybierz i odznaczyć.

<input type="checkbox" name="checkedAll" id="checkedAll"></input> 

<input type="checkbox" name="checkAll" class="checkSingle"></input> 
<input type="checkbox" name="checkAll" class="checkSingle"></input> 
<input type="checkbox" name="checkAll" class="checkSingle"></input> 

Mam nadzieję, że to pomoże komuś tak, jak to dla mnie.