2010-02-12 14 views
83

Che cosa ha jQuery ha l'equivalente id della seguente istruzione?jQuery Determina se una classe abbinata ha un dato ID

$('#mydiv').hasClass('foo') 

in modo da poter fornire un nome di classe e verificare che contenga un ID fornito.

qualcosa di simile:

$('.mydiv').hasId('foo') 
+0

voglio applicare uno stile a un certo div. Ad esempio al momento del caricamento verrebbe mostrato tutto con una classe di foo, ma potrei voler attivare una istanza della classe foo off che ha un id di barra. –

+1

Quindi dovresti semplicemente fare '$ ('# bar.foo'). Toggle();' avrai sempre un solo ID così come sono OBBLIGATORIO per essere univoci per il documento. se si attiva solo per abilitare l'id se è di classe 'pippo', basta aggiungere la classe al selettore id. se il selettore trova un set vuoto, non accadrà nulla, se troverà un set con risultati (di cui ce ne sarà solo uno), cambierà l'elemento. penso che tu stia pensando troppo a questo. – prodigitalson

+0

Sì, certo, grazie. –

risposta

135

È possibile cuocere quella logica nel selettore da combining multiple selectors. Per esempio, si potrebbe indirizzare tutti gli elementi con un dato id, che hanno anche una classe particolare:

$("#foo.bar"); // Matches <div id="foo" class="bar"> 

Questo dovrebbe essere simile a qualcosa che si scrive in CSS. Si noti che non si applica a tutti gli elementi #foo (anche se ce ne dovrebbe essere uno solo) e non si applica a tutti gli elementi .bar (anche se potrebbero essercene molti). Riferirà solo elementi che si qualificano su entrambi gli attributi.

jQuery ha anche un ottimo .is method che consente di determinare se un elemento ha determinate qualità. Puoi testare una collezione jQuery con un selettore di stringhe, un elemento HTML o un altro oggetto jQuery. In questo caso, lo confronteremo con un selettore di stringhe:

$(".bar:first").is("#foo"); // TRUE if first '.bar' in document is also '#foo' 
+22

+1 per 'is()'. Ci dovrebbe essere un selettore '.hasId()' solo perché sembra un partner ovvio a '.hasClass()' davvero ... –

39

avrei probabilmente usare $('.mydiv').is('#foo'); Detto questo, se si conosce l'ID perché wouldnt basta applicarlo al selettore, in primo luogo?

+17

Forse il codice sta entrando in una funzione di callback che deve gestire un determinato caso in modo diverso. Quindi, la funzione passa automaticamente un oggetto jQuery con attributi sconosciuti. In questo caso, $ ('la tua risposta'). È ('utile'); –

+1

Posso pensare a qualsiasi numero di ragioni. Che cosa succede se si desidera applicare un'impostazione specifica per dispositivi mobili, ad esempio se un elemento ha l'id = "mobile". Il perché non è importante. – Placeable

+0

Beh, solo 1 elemento dovrebbe mai avere un dato ID, altrimenti dovrebbe essere un altro attributo ... Suppongo che la posizione strutturale dell'elemento in questione cambi in base alla pagina o al client/user-agent, quindi ok, ma altri di quello ... – prodigitalson

4
$('#' + theMysteryId + '.someClass').each(function() { /* do stuff */ }); 
+0

l'uno non è necessario perché non ci sarà mai più di un # # theMysteryId'. – prodigitalson

+2

Bene, ti risparmia il problema di assegnarlo a una variabile, controllando se la lunghezza non è vuota e quindi procedendo con il codice. Se il selettore non corrisponde a niente, jQuery semplicemente non chiamerà la funzione "each", quindi è carina e pulita. Ora se tutto quello che vuoi fare è chiamare qualche API jQuery, quindi sicuro. – Pointy

4

Solo per dire che alla fine ho risolto questo utilizzando index().

NIENTE altro sembrava funzionare.

Quindi, per gli elementi di pari livello, questo è un buon lavoro da svolgere se si seleziona per la prima volta da una classe comune e si desidera modificare qualcosa in modo diverso per ciascuna specifica.

MODIFICA: per coloro che non conoscono (come me) index() fornisce un valore di indice per ogni elemento che corrisponde al selettore, contando da 0, a seconda del loro ordine nel DOM. Finché sai quanti elementi ci sono con class = "foo" non hai bisogno di un id.

Ovviamente questo non aiuta sempre, ma qualcuno potrebbe trovarlo utile.

7

Diciamo che si sta scorrendo alcuni oggetti DOM e vuoi trovare e prendere un elemento con un certo ID

<div id="myDiv"> 
    <div id="fo"><div> 
    <div id="bar"><div> 
</div> 

è possibile scrivere qualcosa di simile per trovare

$('#myDiv').find('#bar') 

Nota che se dovessi usare un selettore di classe, il metodo find restituirà tutti gli elementi corrispondenti.

o si potrebbe scrivere una funzione di iterazione che farà il lavoro più avanzato

<div id="myDiv"> 
    <div id="fo"><div> 
    <div id="bar"><div> 
    <div id="fo1"><div> 
    <div id="bar1"><div> 
    <div id="fo2"><div> 
    <div id="bar2"><div> 
</div> 

$('#myDiv div').each(function() { 
    if($(this).attr('id') == 'bar1') 
     //do something with bar1 
}); 

Lo stesso codice può essere facilmente modificato per selettore di classe.

<div id="myDiv"> 
    <div class="fo"><div> 
    <div class="bar"><div> 
    <div class="fo"><div> 
    <div class="bar"><div> 
    <div class="fo"><div> 
    <div class="bar"><div> 
</div> 

$('#myDiv div').each(function() { 
    if($(this).hasClass('bar')) 
     //do something with bar 
}); 

Sono contento che hai risolto il tuo problema con indice(), che cosa mai funziona per you.I auguriamo che questo possa aiutare gli altri con lo stesso problema. Saluti :)

17

So che la sua vecchia questione, ma ancora in alto su risultati di Google, più recente jQuery forniscono .has() funzione

$('.mydiv').has('#foo') 
+5

Scusa ma penso che abbiate interpretato male la domanda: [ha() API] (http://api.jquery.com/has/) riporta questo: Riduce il set di elementi corrispondenti a quelli che hanno un * discendente * che corrisponde al selettore o all'elemento DOM. L'OP sta chiedendo come verificare se l'elemento con la classe 'myDiv' ha anche l'id foo, mentre has() cercherà i discendenti di 'myDiv' che hanno l'id 'pippo'. – Tilt

3

Verificare se l'ID di elemento è esistere

if ($('#id').attr('id') == 'id') 
 
{ 
 
    //OK 
 
}

-1

È anche possibile verificare se l'elemento id è utilizzato in questo modo:

if(typeof $(.div).attr('id') == undefined){ 
    //element has no id 
} else { 
    //element has id selector 
} 

Io uso questo metodo per DataTable globali e DataTable ordinate specifici

Problemi correlati