Jquery：忘記DOM結構，只需找到這個類的下一個元素

Question

我覺得這個問題之前已經被問過了，但是答案對於每個海報來說都很特別。

我正在尋找一種方法來識別給定的元素，並找到具有特定類的下一個元素。我不想處理parent（）或children（），因爲我正在解析一個表，並且我不希望它停止在行的末尾，甚至不在表的末尾（那裏是兩個並排）。

有沒有什麼辦法可以爲整個頁面搜索元素的下一個實例？

背景資料： http://jsfiddle.net/HKkAa/2/

我試圖通過底部表迭代開始高亮顯示的電池和應用「亮點」類，每個單元格，直到我到達結束日期。我有一種方法來計算何時到達結束日期，我只需要使用神奇方法來選擇鏈接的下一個實例。

Answer 1

編輯

任何有興趣，我的plugin-指明分數這個位置：https://github.com/techfoobar/jquery-next-in-dom

---

在jQuery中沒有這樣做的內置方法if你希望它是完全通用的並且能夠滿足所有/任何DOM結構。我曾經制定過一個簡單的遞歸函數。它是這樣：

function nextInDOM(_selector, _subject) { 
    var next = getNext(_subject); 
    while(next.length != 0) { 
     var found = searchFor(_selector, next); 
     if(found != null) return found; 
     next = getNext(next); 
    } 
    return null; 
} 
function getNext(_subject) { 
    if(_subject.next().length > 0) return _subject.next(); 
    return getNext(_subject.parent()); 
} 
function searchFor(_selector, _subject) { 
    if(_subject.is(_selector)) return _subject; 
    else { 
     var found = null; 
     _subject.children().each(function() { 
      found = searchFor(_selector, $(this)); 
      if(found != null) return false; 
     }); 
     return found; 
    } 
    return null; // will/should never get here 
} 

你可以這樣調用它：

nextInDOM('selector-to-match', element-to-start-searching-from-but-not-inclusive); 

對於前：

var nextInst = nextInDOM('.foo', $('#item')); 

將讓你的第一個匹配.foo$('#item')後，無論DOM結構

的

檢查原始答案在這裏：https://stackoverflow.com/a/11560428/921204

Answer 2

我會用這樣的遞歸函數：

function findNext($element, selector) { 
    while ($element) { 
     var ne = $element.find(selector); 
     if (ne.length) return ne; 
     ne = $element.next(selector); 
     if (ne.length) return ne; 
     $element = $element.parent(); 
     if ($element.length==0) return null; 
     $element = $element.next(); 
     if ($element.is(selector)) return $element; 
    }  
} 

它搜索旁邊$元素的第一個元素，並在需要之前提前和潛水再次

你可以測試它上升一個級別here（打開控制檯以查看帶有選擇器的「下一個」元素）。

Answer 3

讓我們假設你正在尋找類'.foo'。如果你想要，你可以將它包裝在一個函數中以便可重用。

var $yourelement; 
(...) 

var $allElements = $('.foo'); 
var $nextElement = $allElements[$.inArray($yourElement,$allElements)+1]; 

這將返回$allElements[0]如果$yourElement是最後一個（使其循環列表）

Answer 4

以下代碼允許您查找與選擇器匹配的下一個元素，無論DOM結構如何。

$.fn.nextThrough = function(selector) { 
    // Our reference will be the last element of the current set 
    var $reference = $(this).last(); 
    // Add the reference element to the set the elements that match the selector 
    var $set = $(selector).add($reference); 
    // Find the reference position to the set 
    var $pos = $set.index($reference); 
    // Return an empty set if it is the last one 
    if ($set.length == $pos) return $(); 
    // Return the next element to our reference 
    return $set.eq($pos + 1); 
} 

// Usage example 
$(':focus').nextThrough('input:visible').focus();