jQuery爲每個孩子複選框在一個段落編號

Question

如何選擇名爲id =「Paragraph1」的段落中的每個子複選框，並取消選中它，如果它的選中，然後禁用它在jQuery中。

實施例：

<input type="checkbox" id="chkMain"><br /> 
<p id="Paragraph1"> 
    <input type="checkbox" id"chk1"><br /> 
    <input type="checkbox" id"chk2"><br /> 
    <input type="checkbox" id"chk3"><br /> 
    <input type="checkbox" id"chk4"><br /> 
</p> 

jQuery的選擇：

$("#chkMain:not(:checked)").change(function() { 
    $("#Paragraph1").children("input[type='checkbox' :checked]").each(function() { 
     $(this).removeAttr("checked").attr("disabled",disabled");  
    }); 
}); 

該代碼是不正確的工作二/三其僅工作一半的時間由於某種原因在IE8。也使用查找不工作的權利或者B/C段落不是一個好父母。

Answer 1

input[type='checkbox' :checked]是不正確的選擇器。

它應該是：

input[type='checkbox']:checked

而且我認爲你可以簡化像代碼：

$('#Paragraph1 input[type="checkbox"]:checked') // select all checked input 
        .removeAttr('checked')  // remove checked attribute 
        .prop('disabled', true);  // make em disabled 

Answer 2

替換這一切：

$("#Paragraph1").children("input[type='checkbox' :checked]").each(function() { 
    $(this).removeAttr("checked").attr("disabled",disabled");  
    }); 

有了這個：

$("#Paragraph1 input[type='checkbox']:checked") 
    .prop('checked', false) 
    .prop('disabled', true); 

• ，當你想要做的東西是不可用jQuery的API的每一個元素上設置的，像alert或發送AJAX請求您應該使用each。

• 當你可以使用prop時，不要亂用屬性。

• CSS選擇器中的空間意味着「children of」，因此請刪除:checked的空間並在Paragraph1和輸入之間添加一個空格。直接孩子，你可以使用parent > children

喜歡這一點：

$("#Paragraph1 > input[type='checkbox']:checked") 
    .prop('checked', false) 
    .prop('disabled', true); 

Answer 3

有在你的代碼的幾個語法錯誤，你可以使用prop方法：

$("#chkMain").change(function() { 
    $("#Paragraph1 input[type='checkbox']") 
       .prop('checked', this.checked) 
       .prop('disabled', !this.checked) 
});