Gli ID duplicati rovinano i selettori jquery?

Question

Se avessi due div, entrambi con id="myDiv"

Volevo $("#myDiv").fadeOut(); svanire entrambi i div?Oppure sbiadirebbe solo il primo/secondo?O nessuno?

Come faccio a cambiare quale svanisce?

Nota: So che gli ID duplicati vanno contro gli standard, ma sto utilizzando il popup modale fancybox e duplica il contenuto specificato sulla tua pagina per il contenuto del popup.Se qualcuno conosce un modo per aggirare questo problema (forse sto usando fancybox in modo sbagliato), per favore fatemelo sapere.

Answer 1

jQuery corrisponde esattamente a un elemento quando si richiede un ID. Una matrice di al massimo un oggetto Element verrà restituita da $("#foo").get(). Consulta la documentazione jQuery per ulteriori informazioni o provala tu stesso

$(function() {
    alert($("#foo").length);
});

Answer 2

Gli ID elemento dovrebbero essere univoci. Avere più DIV dello stesso ID sarebbe errato e imprevedibile e sfugge allo scopo dell'ID. Se hai fatto questo:

$('.myDiv').fadeOut();

Ciò li sbiadirebbe entrambi, supponendo che tu dia loro una classe di myDiv e ID univoci (o nessuno).

Answer 3

"Nota:So che i documenti d'identità duplicati vanno contro gli standard"

Allora non farlo.Hai già risolto due problemi.Viola gli standard e interferisce con il meccanismo di selezione di jQuery (e in effetti dei normali DOM).Probabilmente ci saranno altri problemi in futuro.

Molto probabilmente, tu Sono utilizzo sbagliato di fancybox, nel qual caso spero che qualcuno che abbia familiarità con esso ti aiuti.O peggio, se lo script stesso è difettoso, non dovresti usarlo.

Answer 4

Poiché $ ('# myDiv') restituirà solo il primo div con quell'ID, dovrai trovare tutti gli elementi con quell'ID usando questo trucco:

$('[id=myDiv]');

Quindi, nel tuo caso, applicare la dissolvenza a tutti quei div:

$('[id=myDiv]').fadeOut();

E se vuoi assicurarti che la tua pagina non abbia questo ID due volte, puoi rimuovere quelli extra facendo questo:

$('[id=myDiv]:gt(0)').remove();

Answer 5

Puoi anche seguire il percorso usando find (). find restituirà tutti gli elementi con quell'ID e, se necessario, puoi limitare l'ambito a un genitore specifico, prova qualcosa come $(document).find('#myDiv').fadeOut();

o

$('.parentElement').find('#myDiv').fadeOut();

Answer 6

Ho riscontrato lo stesso problema. Apparentemente, quando crei contenuti nella pagina da cui desideri aprire una Fancybox, crea un div mirror del contenuto originale. Nel mio caso, i controlli sono stati racchiusi in un div che fancybox crea denominato, & Quot; fancy_div & Quot;

Sono stato in grado di selezionare il controllo e ottenerlo & # 8217; valore usando il seguente formato per il selettore:

$ ('# fancy_div [id = InputText]'). val ();

i tuoi controlli potrebbero esistere altrove all'interno della Fancybox. la cosa migliore da fare è guardare l'origine visualizzazioni, ma è complicata.

Per accedere alla sorgente della vista, utilizzare la seguente tecnica: Inserisci questo tag nel tuo modulo: Ottieni valore Apri il modulo, fai clic sul tag per aprire la finestra di avviso.
Assicurati che il cursore si trovi all'interno del contenuto della pagina (trova un controllo e fai clic).
Fare clic con il pulsante destro del mouse sul controllo e selezionare & Quot; visualizzare l'origine & Quot ;.
Esistono molti div, quindi cerca il div che contiene i tuoi contenuti.

Spero che questo aiuti.

Answer 7

Di recente ho avuto un problema simile. Avevo un'unica pagina che mostrava contenuti diversi attraverso un caricamento Ajax. C'è un pulsante che attiva il server per generare un'immagine PDF.

La mia soluzione originale era quella di utilizzare un selettore di classe, che funzionava bene, ma causava attrito con un altro sviluppatore. C'erano già così tante classi nei collegamenti che l'uso di una classe come identificatore ha reso il codice brutto. Quindi ho usato un attributo name:

<a name="printButton"....

$('a[name="printButton"]').on('click',function(){....

Ha funzionato semplicemente da dandy!