jQuery中Input屬性checkBox用removeAttr後無效的陷阱

最近在作項目中，前臺頁面上有不少個checkBox，要根據條件來判斷，哪些選中，哪些移除選中效果。

發現checkBox在使用中，第一次好用，可是取消過一次以後，再想讓其變爲選中狀態就不行了。

因爲代碼是從另外一個系統遷移過來的，在此係統中運行正常。可是放到本身項目中，就沒法正常使用了。因而懷疑是jQuery版本問題致使的。

代碼以下：

$("#topRadio input").removeAttr("checked");
    $("#topRadio input").parent().removeClass("checked");
    var currentDom = $(".container_7[date='" + dataChoose + "']");
    if (dataJson[dataChoose].state == 0) {
        currentDom.find("input[type='checkbox']").removeAttr("checked");
    }
    else if (dataJson[dataChoose].state == 1) {
        currentDom.find("input[type='checkbox']").attr("checked", "true");
    }

首先進行判斷，若是不符合條件了，就removeAttr("checked")，在下一次判斷的時候若是符合條件在給加上checked。

可是發現一旦移除了 attribute - checked ，在加上的時候就加不上了。

百度以後發現不少同窗也同樣遇到了這個問題

---

在作複選框全選按鈕的時候，出現了一個問題，使用語句$.attr(‘checked‘,true)，將複選框的屬性改成被選中，在chrome瀏覽器中第一次點擊有效後面就不行了，IE8卻是沒有問題。

百度了好久找到緣由是HTML的屬性分爲attribute和property，暫且將後者稱爲特性。

checked屬性即分爲attribute->checked，和property->true,false。

對於一個checkbox，若未定義checked="checked"，alert($.attr("checked")) 的結果是undefined。若已定義則結果是checked。attribute並不隨着checkbox的狀態變化而改變。

使用prop($.attr("checked"))的話輸出則分別爲false和true。property則隨其變化而變化。

因此在修改checked屬性時要使用prop()。prop()在jQuery1.6版本後新增。

---

因而修改代碼：

var currentDom = $(".container_7[date='" + dataChoose + "']");
    if (dataJson[dataChoose].state == 0) {
        currentDom.find("input[type='checkbox']").prop("checked",false);
    }
    else if (dataJson[dataChoose].state == 1) {
        console.log(currentDom);
        console.log(currentDom.find("input[type='checkbox']").attr("checked"));
        currentDom.find("input[type='checkbox']").prop("checked", "true");
    }

改成用prop來給複選框設置選中效果，問題解決。 此問題應該是jQuery版本問題，若是發現出現了這個問題：

1.不妨換個版本

2.設置checkBox的屬性方法用 prop（）

---

一直覺得是，jQuery選擇器的問題，沒有選擇到元素，坑了我很久。