我checkAll複選框腳本不工作

Question

我正在使用jquery 1.6.1來檢查所有的複選框。
這是我的HTML代碼：

<form action=""> 
    <div class="stats"> 
     <h2 class="title">Reason for Celebrity</h2> 
     <input name="reason" type="checkbox" value="net" />Famous on the internet<br/> 
     <input name="reason" type="checkbox" value="crim" />Committed a crime<br /> 
     <input name="reason" type="checkbox" value="model" />Dates a super model<br /> 
     <input name="reason" type="checkbox" value="tv" />Hosts a TV show<br /> 
     <input name="reason" type="checkbox" value="japan" />Big in Japan<br /> 
     <hr /> 
     <input class="check-all" name="reason" type="checkbox" /><span>Check all</span> 
     <br/> 
     <input type="submit" value="Submit" class="submit" /> 
    </div> 
    </form> 

和我的check腳本都是這樣的：

$(document).ready(function(){ 
    $('.check-all:checkbox').change(function() { 
    var group = ':checkbox[name=' + $(this).attr('name') + ']'; 
    $(group).attr('checked', $(this).attr('checked')); 
    }); 
}); 

但這對複選框取消選中的不行。你能幫我解決這個問題嗎？

Answer 1

嘗試更換

$(group).attr('checked', $(this).attr('checked')); 

與

$(group).attr('checked', $(this).is(':checked')); 

Answer 2

$(this).attr('checked') - 返回undefined

你應該這樣做：

var variable = (undefined == $(this).attr('checked'))?false:$(this).attr('checked'); 
$(group).attr('checked', variable); 

爲了避免未定義值

Answer 3

問題是您沒有明確添加任何選項來取消選中複選框。 一個做到這一點適當的方式將

$(document).ready(function(){ 
    $('.check-all:checkbox').change(function(event) { 
    var group = ':checkbox[name=' + $(this).attr('name') + ']'; 
     $(group).each(function(){ 
     this.checked = event.target.checked; 
     }); 
    }); 
}); 

一個工作小提琴：

http://jsfiddle.net/PmuLz/2/