使用 jquery/js 獲取下一個元素

Question

我有一些元素，比如

<div id="myDiv">
    <p><input type="checkbox" />text</p>
    <p>special text</p>
    <p><input type="checkbox" />text</p>
    <p><input type="checkbox" />text</p>
</div>

我的目標是檢查“特殊文本”下方的輸入框。 因此我創建了一個變量 findText 來查找“特殊文本”

var findText = $("#myDiv:contains('special text')");

我正在檢查是否存在“特殊文本”，如果存在，我希望檢查下一個輸入元素。 .nextAll()不幸的是得到了以下兄弟姐妹。 但是我怎樣才能調用下一個元素呢？

 var findText = $("#myDiv:contains('special text')");

    if(findText.length > 0) {
      findText.nextAll("input").attr("checked",true)
    }

感謝您的時間和幫助。

Answer 1

帶有find的nextAll應該這樣做：

findText.nextAll("p").find("input").attr("checked",true);

這將找到以下段落及其后代輸入。 （或者使用children而不是find輸入是否保證是段落的直接孩子。）

...但我認為您的findText選擇器不正確，請嘗試：

var findText = $("#myDiv p:contains('special text')");
//                      ^^^---- change here

把所有這些放在一起：

var findText = $("#myDiv p:contains('special text')");

if(findText.length > 0) {
  findText.nextAll("p").find("input").attr("checked",true)
}

實時復制

另外，您可以考慮使用 jQuery 的自定義:checkbox選擇器將搜索限制為僅復選框：

var findText = $("#myDiv p:contains('special text')");

if(findText.length > 0) {
  findText.nextAll("p").find(":checkbox").attr("checked",true)
  //                         ^^^^^^^^^^^-- Change here
}

實時復制

Answer 2

你可以這樣做：

$("#myDiv p:contains('special text')").next().children('input').prop('checked',true);

示例： http://jsfiddle.net/HVSyE/3/

編輯：如果要檢查文本后的所有復選框，則：

$("#myDiv p:contains('special text')").nextAll('p').children('input').prop('checked',true);

示例： http://jsfiddle.net/HVSyE/4/