Powoduje duplikowanie identyfikatorów jQuery?

Question

Gdybym miał dwa elementy div, oba z identyfikatorem = "myDiv"

Czy znikają oba elementy div z poziomu $("#myDiv").fadeOut();? Czy może znikną tylko pierwsze/drugie? Lub w ogóle żadnego?

Jak zmienić, który z nich zanika?

Uwaga: wiem duplikaty identyfikatorów jest wobec norm, ale używam popup modalne fancybox i powiela określony treści na swojej stronie za treści popup. Jeśli ktoś wie, jak to obejść (może używam fancyboksa źle), proszę dać mi znać.

Answer 1

jQuery dopasowuje dokładnie jeden element podczas wysyłania zapytania o identyfikator. Tablica co najwyżej jednego obiektu Element zostanie zwrócona przez $("#foo").get(). Więcej informacji znajduje się w jQuery documentation lub wypróbuj sam.

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

Answer 2

Identyfikatory elementów mają być unikalne. Posiadanie wielu DIV o tym samym ID byłoby niepoprawne i nieprzewidywalne, i sprzeciwia się celowi ID. Jeśli tak to:

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

Że znikną oboje się, zakładając, że im klasę myDiv i unikalnych identyfikatorów (albo wcale).

Answer 3

„Uwaga: Wiem duplikaty identyfikatorów jest niezgodne standardów”

Wtedy nie rób tego. Już odkryłeś dwa problemy. Narusza standardy, a to zakłóca mechanizm wyboru jQuery (a właściwie standardowy DOM). Prawdopodobnie będzie więcej problemów w przyszłości.

Całkiem możliwe, że są przy użyciu fancybox źle, w takim przypadku mam nadzieję, że ktoś obeznany z nim pomaga. Lub gorzej, jeśli sam skrypt jest wadliwy, nie powinieneś go używać.

Answer 4

Wpadłem na ten sam problem. Wygląda na to, że gdy tworzysz zawartość na stronie, z której chcesz otworzyć Fancybox, tworzy ona kopię lustrzaną oryginalnej treści. W moim przypadku, kontrole zostały zawinięte w div że fancybox tworzy nazwie „fancy_div”

byłem w stanie wybrać kontrolę i uzyskać jego wartość za pomocą następującego formatu selektora:

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

Twoje elementy sterujące mogą występować w innym miejscu w ramach Fancybox. najlepiej jest spojrzeć na źródło, ale jest to trudne.

Aby dostać się do źródła widoku, użyj następującej techniki: Umieść ten tag w formularzu: wartość Get Otwórz formularz, kliknij na znacznik, aby otworzyć okno alertu.
Upewnij się, że kursor znajduje się w treści strony (znajdź element sterujący i kliknij).
Kliknij prawym przyciskiem myszy i wybierz "Wyświetl źródło".
Istnieje grupa elementów div, więc poszukaj elementu zawierającego treść.

Mam nadzieję, że to pomoże.

Answer 5

Od $ ('# myDiv') zwróci jedynie pierwszy div z tym identyfikatorem, musisz znaleźć wszystkie elementy z tej ID stosując ten trick:

$('[id=myDiv]'); 

więc w Twoim przypadku, stosować Fadeout do wszystkich tych dIV:

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

A jeśli chcesz mieć pewność, że strona nie posiada dwukrotnie ten identyfikator to można usunąć dodatkowe te, wykonując to:

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

Answer 6

Możesz także wybrać trasę za pomocą funkcji find(). znaleźć zwróci wszystkie elementy z tym identyfikatorem, można ograniczyć zakres do konkretnego rodzica w razie potrzeby spróbować czegoś podobnego $(document).find('#myDiv').fadeOut();

lub

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

Answer 7

Niedawno miałem podobny problem. Miałem jedną stronę, która wyświetlała inną zawartość poprzez ładunek Ajax. Istnieje przycisk, który uruchamia serwer, aby wygenerować obraz PDF.

Moim oryginalnym rozwiązaniem było użycie selektora klasy, który działał dobrze, ale powodował tarcie u innego programisty. W linkach było już tyle klas, że użycie klasy jako identyfikatora spowodowało, że kod był brzydki. Więc użyłem atrybutu nazwy:

Pracowałem tylko dandy!