1. 程式人生 > >複選框組的全選、全不選點選兩次後,attr()不生效、checkBox狀態不改變問題

複選框組的全選、全不選點選兩次後,attr()不生效、checkBox狀態不改變問題

複選框組的全選、全不選點選兩次後,attr不生效、checkBox狀態不改變問題,最後發現attr和prop的區別
<input type="checkbox" name="chk_all" id="chk_all" />全選
<input type="checkbox" name="chk_list" id="chk_list_0" value="0" />
<input type="checkbox" name="chk_list" id="chk_list_1" value="1" />
<input type="checkbox" name="chk_list" id="chk_list_2" value="2" />
<input type="checkbox" name="chk_list" id="chk_list_3" value="4" />
點選全選/全不選框,JS中方法如下:
$("#chk_all").click(function () {
var isCheck = $("input[name='chk_all']").is(':checked');
        //alert(isCheck);
        if (isCheck) {
        $("input[name='chk_list']").prop("checked", true);
        }
        else {
                $("input[name='chk_list']").prop("checked", false);
        }
 });
至於使用attr()方法不可以反覆改變複選框的選中情況,是因為attr()是用來改變元素的attributes屬性的,而prop()是用來改變元素properties屬性的,當涉及到boolean值時,attributes在頁面載入的時候就被設定,並且一直保持初始值,而properties則儲存著元素屬性的當前值。所以,要在頁面載入後動態更新的話,使用prop()方法。