jQuery: Seleziona gli elementi della classe X che non hanno fratelli con quella classe

Question

Voglio selezionare solo gli elementi che corrispondono alla classe X e non hanno fratelli che hanno anche classe X. Nel mio caso, X = hasDatepicker. Ecco cosa mi è venuta in mente:

$('.hasDatepicker:not(.hasDatepicker ~ .hasDatepicker)') 

Tuttavia, ciò non esclude il primo elemento, quindi in qualsiasi gruppo di datepickers, questo sarà ancora scegliere il primo. Non voglio includere quelli che sono in un gruppo, solo i singoli.

Esempio con Partita:

<div class="input text"> 
<input name="data[Goal][date_started]" type="text" value="" class="hasDatepicker" style="display: none; "> 
<button type="button" class="ui-datepicker-trigger"><img src="/themed/mocha/images/btn_calendar.png" alt="..." title="..."></button> 
</div> 

Esempio con Partite:

<div class="input text"> 
<input type="text" value="" id="GoalDateStarted" class="hasDatepicker"><input type="text" value="" class="hasDatepicker" style="display: none; "> 
<input type="text" value="" class="hasDatepicker" style="display: none; "> 
<input name="data[Goal][date_started]" type="text" value="" class="hasDatepicker" style="display: none; "> 
<button type="button" class="ui-datepicker-trigger"><img src="/themed/mocha/images/btn_calendar.png" alt="..." title="..."></button> 
</div> 

Tutte le idee? Grazie!

Answer 1

Non è che elegante ma ha il trucco usando l':first-child pseudo-selettore e filtrare il set di risultati con .filter():

• :first-child aiuterà selezionare solo il primo elemento .test of a possible multipli fratelli lista

• uso .filter() per verificare effettivamente se non ci sono fratelli con la stessa classe

Ecco il codice:

var a = $('.test:first-child').filter(function() { 
    //return $(this).parent().find('.test').not(this).length == 0; 
    return !$(this).siblings('.test').length 
}); 

DEMO