找到包含在div中的文本並獲取其子項複選框ID

Question

我正在嘗試編寫一個腳本，該腳本從複選框元素中獲取ID並對其執行操作。問題是我無法通過值從mysql查詢生成的複選框。

下面是複選框的HTML的樣子：

<div class="cat_checkbox cat_unchecked"> 
    <input id="r_c136" type="checkbox" value="36" name="r_c1[]"> 
    Sample 
</div> 
<div class="cat_checkbox cat_unchecked"> 
    <input id="r_c131" type="checkbox" value="31" name="r_c1[]"> 
    Text1 
</div> 

這裏是我好不容易纔寫的代碼（我真的仍然在學習Java腳本和jQquery）。 我想要做的是告訴js選擇包含「Text1」的內容並找到其中的複選框，獲取其ID，然後將選中的道具添加到該項目。

但相反，它選擇第一個div找到裏面的複選框，並檢查它裏面的值。

$("#click").click(function() { 


     if ($("div:contains('Text1')")) 
         { 
         id = $("div:contains('Text1')").find("input[type='checkbox']").attr("id")+""; 
         alert(id); 

         $("#"+id).prop("checked", !($("#"+id)).is(':checked')); 
         } 

     }); 
     }); 

任何幫助都會被列出。謝謝。

Answer 1

使用$("div:contains('Text1')").length，而不是$("div:contains('Text1')")

改變你的代碼

$("#click").click(function() { 
    if($("div:contains('Text1')").length) { 
     var checkbox = $("div:contains('Text1')").find("input[type='checkbox']"); //Find Checkbox here 
     checkbox.prop("checked", !checkbox.is(':checked')); 
    } 
}); 

DEMO

更改代碼

$("#click").click(function() { 
    var checkbox = $("div:contains('Text1')").find("input[type='checkbox']"); 
    if (checkbox.length) { 
     checkbox.prop("checked", !checkbox.is(':checked')); 
    } 
}); 

Updated DEMO