jQuery seleccione hermanos 'hasta'

Question

que tienen un DOM en forma de

<input class="parent"></div> 
<input class="child"></div> 
<input class="child"></div> 
<input class="parent"></div> 
<input class="child"></div> 
... 

que sé que no está bien y la manera correcta de hacer esto sería reformar el código HTML, pero digamos que eso no es posible.

¿Cómo puedo obtener jQuery para seleccionar todos los hijos de uno de los padres (es decir seleccionar todos .children hasta .parent)

Answer 1

jQuery 1.4 ahora tiene la función .nextUntil (selector):

$('div.parent').toggle(
     function() { 
      $(this).nextUntil('div.parent').hide(); 
     }, 
     function() { 
      $(this).nextUntil('div.parent').show(); 
     } 
    ); 

Answer 2

Se puede recorrer los elementos nextAlldiv hermanos hasta que encuentre el siguiente .parent, marca esta example :

$('.parent').click(function() { 
    $(this).nextAll('div').each(function() { 
    if ($(this).is('.parent')) { 
     return false; // next parent reached, stop 
    } 
    $(this).toggleClass('highlight'); 
    }); 
}); 

de marcado utilizado:

<div class="parent">parent 1</div> 
<div class="child">child</div> 
<div class="child">child</div> 
<div class="parent">parent 2</div> 
<div class="child">child</div> 
<div class="parent">parent 3</div> 
<div class="child">child</div> 
<div class="child">child</div> 
<div class="child">child</div> 

...

Answer 3

* Véase la respuesta @foson para jQuery 1.4+ *

Salida Ben Almans until utils.

Le da 3 métodos útiles: nextUntil, prevUntil, parentsUntil.

Answer 4

creo que no hay necesidad de las funciones personalizadas anteriores, jQuery soporta esta funcionalidad nextUntil(selector, filter) función, pero usted debe agregar el filtro sólo se aplican a su script para los elementos filtrados no para todos los elementos siguientes:

//hide all .child elements 
$('div.child').hide(); 
$('div.parent').click(function() { 
    //Toggle (show or hide) only .child elements until finding .parent element. 
    $(this).nextUntil('div.parent', 'div.child').slideToggle('slow'); 
});