2011-04-20 11 views
51

Normalmente quando uso una classe come selettore cerco di utilizzare un selettore "id" con esso in modo che non ricerchi l'intera pagina ma solo un'area in cui si trova la classe.Multiple selector chaining in jQuery?

Tuttavia, ho una vista parziale con codice in esso. Questa vista parziale (codice comune) viene avvolta attorno a un tag modulo.

ho:

<form id="Create"> 
// load common code in from partial view 
</form> 

<form id="Edit"> 
// load common code in from partial view 
</form> 

Ora, in questo codice comune Ho bisogno di allegare un plugin per i campi in modo che vorrei fare

$('#Create .myClass').plugin({ options here}); 

$('#Edit .myClass').plugin({options here}); 

Quindi è più o meno lo stesso codice. Mi chiedo se c'è un modo per farlo cercare uno dei due id?

Modifica

sto avendo problemi con esso quando ho variabili per i miei selettori

my.selectors = 
    { 
     A: '#Create', 
     B: '#Edit', 
     Plugin: ' .Plugin' 
    }; 

$(selector.A+ selectors.Plugin, selector.B+ selectors.Plugin) 

Non sembra funzionare.

risposta

71

È possibile combinare più selettori con una virgola:

$('#Create .myClass,#Edit .myClass').plugin({options here}); 

Oppure, se si sta andando ad avere un gruppo di loro, si potrebbe aggiungere una classe a tutti i vostri elementi del modulo e quindi cercare all'interno di quella classe. Questo non ti dà il presunto risparmio di velocità di limitare la ricerca, ma onestamente non mi preoccuperei troppo di questo se fossi in te. I browser fanno un sacco di cose stravaganti per ottimizzare le operazioni comuni dietro la schiena: il semplice selettore di classe potrebbe essere più veloce.

6

piace:

$('#Create .myClass, #Edit .myClass').plugin({ 
    options: here 
}); 

È possibile specificare un numero qualsiasi di selettori per unire in un unico risultato. Questo combinatore di espressioni multiple è un modo efficace per selezionare elementi disparati. L'ordine degli elementi DOM nell'oggetto jQuery restituito potrebbe non essere identico, poiché saranno nell'ordine del documento. Un'alternativa a questo combinatore è il metodo .add().

37

$("#Create").find(".myClass").add("#Edit .myClass").plugin({});

Usa $.fn.add per concatenare due set.

10

Si dovrebbe essere in grado di utilizzare:

$('#Edit.myClass, #Create.myClass').plugin({options here}); 

jQuery | Multiple Selectors

8

penso che si potrebbe vedere un po 'meglio le prestazioni da fare in questo modo:

$("#Create, #Edit").find(".myClass").plugin(){ 
    // Options 
}); 
0

Ci sono già molto buone risposte qui, ma in alcuni altri casi (non questo in particolare) l'uso della mappa potrebbe essere la "sola" soluzione.

Specialmente quando vogliamo usare espressioni regolari diverse da quelle standard.

Per questo caso si sarebbe simile a questa:

$('.myClass').filter(function(index, elem) { 
    var jElem = $(elem); 

    return jElem.closest('#Create').length > 0 || 
      jElem.closest('#Edit').length > 0; 

}).plugin(...); 

come ho detto prima, qui questa soluzione potrebbe essere inutile, ma per ulteriori problemi, è una buona opzione