Razor，HTML，jQuery：如何選中/取消選中所有複選框？

Question

我在剃刀下面的代碼和HTML：

@:<td> 
      <input class="privcheck" 
       type="checkbox" 
       name="selectedPrivileges" 
       value="@priv.PrivilegeID" 
      @(Html.Raw(priv.Assigned ? "checked=\"checked\"" : "")) /> 
      @priv.PrivilegeName 

    @:</td> 

<button id="checkallprivs"> 
    Select All 
</button> 

<button id="uncheckallprivs"> 
    Deselect All 
</button> 

而下面的jQuery：

$("#checkallprivs").button(); 
$("#uncheckallprivs").button(); 

$(document).on("click", "#checkallprivs", function (event) { 
        event.preventDefault(); 
        $('.privcheck:checkbox').attr('checked', 'checked'); 

       }); 

$(document).on("click", "#uncheckallprivs", function (event) { 
        event.preventDefault(); 
        $('.privcheck:checkbox').removeAttr('checked'); 
       }); 

當我點擊 「全選」 按鈕，它會檢查所有的箱子。之後，如果我點擊「全部取消」，則取消選中所有複選框。然而，問題是，一旦我點擊deselct按鈕，Select All按鈕在單擊時不會執行任何操作。我如何得到預期的行爲？

謝謝。

Answer 1

我會建議使用的prop()代替attr()

$(document).on("click", "#checkallprivs", function (event) { 
    event.preventDefault(); 
    $('.privcheck:checkbox').prop('checked', true); 

}); 

$(document).on("click", "#uncheckallprivs", function (event) { 
    event.preventDefault(); 
    $('.privcheck:checkbox').prop('checked', false); 
});