nextUntil() не работает в этом случае

Question

<table> 
    <tr class="codesgroupheader"><td>Header1</td></tr> 
    <tr><td>1</td></tr> 
    <tr class="codesgroupheader"><td>Header2</td></tr> 
    <tr><td>2</td></tr> 
    <tr class="codesgroupheader"><td>Header3</td></tr> 
    <tr><td>3</td></tr> 
    <tr class="codesgroupheader"><td>Header4</td></tr> 
</table> 

А вот код JQuery

$('.codesgroupheader').not(':last').each(function() { 
    alert($(this).nextUntil('.codesgroupheader').find('tr').size()); 
}); 

Но он всегда возвращает меня ноль ..

Answer 1

Ваш код выполняет следующие действия:

$(this)      // <tr>   <-- = this 
.nextUntil('.codesgroupheader')// All elements between this and <tr class="..."> 
.find('tr')     // Seeks for a <tr> inside <tr> - Not found 

Если вы хотите выбрать количество элементов <tr> с данным классом, используйте:

alert($('tr.codesgroupheader').not(':last').length); 

Если вы хотите, чтобы получить число <tr> с между текущим и следующим <tr class=...>, используйте:

// this = any <tr> 
$(this).nextUntil(".codesgroupheader", "tr").length; 

Для получения дополнительной справки и использования функции nextUntil см jQuery documentation.

Answer 2

this ссылается на текущий элемент tr.

nextUntil('.codesgroupheader') найдет все элементы между this и следующими tr.codesgroupheader.

Ваш .find пытается выполнить поиск внутри этого набора (поэтому внутри tr). вы можете полностью пропустить find, или если по какой-то причине вы считаете, что там могут быть другие элементы, используйте вместо этого filter (или второй параметр nextUntil), который фильтрует текущий набор.

Так или использовать

$('.codesgroupheader').not(':last').each(function() { 
    alert($(this).nextUntil('.codesgroupheader').size()); 
}); 

или фильтровать

$('.codesgroupheader').not(':last').each(function() { 
    alert($(this).nextUntil('.codesgroupheader').filter('tr').size()); 
}); 

или (с использованием второго параметра nextUntil)

$('.codesgroupheader').not(':last').each(function() { 
    alert($(this).nextUntil('.codesgroupheader', 'tr').size()); 
});