2012-08-18 8 views
5

Zawiązałem zdarzenie transitionend do div1. Po zakończeniu przejścia div1 wydarzenie się uruchomiło. Nie ma problemu.Dlaczego zdarzenie przejściowe można uruchomić po zakończeniu przenoszenia elementu?

że wystąpił przypadek szczególny:

Po dodaniu 3 akapitów tego div1 podczas przejścia każdy akapit zostaje zakończony, transitionend zdarzenie div1 jest również prowadził. Więc zdarzenie transitionend przebiegło 4 razy. >. <

W transitionend ciała słuchacza funkcja imprezy za div1 „s, widzę, że event.target! == this. Czuję, że to całkiem śmieszne!

Zarówno Chrome, jak i Firefox mają ten problem. Zgaduję więc, że to nie jest błąd implementacji specyfikacji HTML5 przeglądarki.

Czy ktoś może wyjaśnić, dlaczego zdarzenie transitionend elementu może zostać wywołane przez element potomny tego elementu?

Dziękuję.

+0

można pisać kod? – tptcat

+0

Nie mogę uzyskać kodów reprodukcji tego problemu. Ale jestem pewien, że widzę "event.target! == this" w treści funkcji detektora zdarzenia "transitionend". Nie mogę zrozumieć tego dziwnego problemu. Czy uważasz, że jest to błąd zarówno przeglądarki Chrome, jak i Firefoksa? – weilou

Odpowiedz

9

To się nazywa bulgotanie zdarzeń. Wiele zdarzeń występujących w elemencie podrzędnym będzie domyślnie wywoływać bąbelki między rodzicami po wywołaniu wywołania zdarzenia na obiekcie źródłowym. Możesz wykryć bulgotanie, jak zauważyłeś, badając obiekt event lub możesz zapobiec propagacji poprzez zatrzymanie propagacji podczas obsługi zdarzenia na obiekcie źródłowym.

Zatrzymywanie propagacji jest jedną z tych rzeczy, które różnią się w IE w porównaniu z innymi przeglądarkami. W innych przeglądarkach, zadzwonić:

event.stopPropagation() 

w IE przed IE9:

window.event.cancelBubble = true; 
+1

Dziękuję za odpowiedź. Po pierwsze, myślę, że wydarzenie "transitionend" powinno być wyjątkowe. Nie należy go dodawać do łańcucha propagacji zdarzeń. Dlatego W3C powinien ulepszyć specyfikację zdarzenia 'transitionend' HTML5. Po drugie, naprawdę nie wiążę zdarzenia "transitionend" z 3 akapitami. Czyli ... Wygląda na to, że jest to błąd związany z błędem implementacji specyfikacji HTML5 przeglądarki Firefox? Ustawiam tylko "przejście" na 3 akapity. – weilou

+3

@WeiLou - wiele baniek zdarzeń (kliknięcia, klucze itp.). W taki sposób thnigs działa w przeglądarce, więc 'transitionend' nie różni się od innych zdarzeń. Musisz to teraz wiedzieć i napisać kod. Jeśli chcesz wiedzieć, czy zdarzenie należy do tego konkretnego obiektu, po prostu spójrz na 'event.target', aby zobaczyć, czy pasuje do twojego obiektu, czy też jest to jakiś inny obiekt. Bulgotanie może być bardzo, bardzo przydatne w pewnych okolicznościach. – jfriend00

+0

Dziękuję za komentarz. :) – weilou

Powiązane problemy