A ordem dos eventos
Suponha que outro elemento esteja aninhado em um elemento e ambos tenham um manipulador de eventos OnClick. Se o usuário clicar no elemento 2, os eventos de clique do elemento 1 e 2 serão acionados. Mas qual evento é acionado primeiro? Qual função de manipulador de eventos será executada primeiro? Em outras palavras, qual é a ordem em que os eventos ocorrem? Conforme mostrado na figura abaixo, quando a área do elemento de span for clicada, os três eventos de clique serão acionados, mas qual é o pedido?
<div onclick = "func1"> <p onclick = "func2"> <span onclick = "" func3> </span> </p> </div>
Dois modelos
Netscape e Microsoft têm dois métodos completamente diferentes de lidar com este evento:
• Netscape defende que os eventos ocorrerão da camada mais externa até o elemento mais específico, e essa sequência de eventos é chamada de tipo de captura
• A Microsoft mantém os eventos do elemento interno e depois se espalha. Esta sequência de eventos é chamada de tipo de bolha
A ordem desses dois eventos é completamente oposta. O navegador Explorer suporta apenas eventos de bolhas, tanto Mozilla, Opera7 quanto KonQueror. O Ópera e o ICAB mais antigos não suportam
W3C
Qualquer evento que ocorra no modelo de evento W3C entra primeiro no estágio de captura até que o elemento de destino seja alcançado e depois entre no estágio da bolha.
Para o desenvolvimento normal da Web, você pode optar por vincular a função de manipulador de eventos no estágio de captura ou no estágio da bolha. Isso é alcançado através do método addEventListener (). Se o parâmetro de usecaptura desta função for verdadeiro, a função será ligada no estágio de captura e vice -versa, a função será ligada no estágio da bolha.
Element.AddeventListener (evento, função, USECAPTURA)
Pare de bolhas
Durante o desenvolvimento normal, se você deseja impedir a propagação de eventos, poderá fazê -lo através de um método.
No modelo da Microsoft, você deve definir a propriedade CancelBubble do evento como True
Window.Event.cancelbubble = true
No modelo W3C, você deve chamar o método StopPropagation () do evento
E.StopPropagation ()
Chamar esses métodos impedirá que todas as bolhas se espalhem para fora. Solução de navegador transversal:
função doSomething (e) {if (! e) {var e = window.event; e.cancelbubble = true; } if (e.stopPropagation) {e.stopPropagation (); }}O artigo acima detalhado das bolhas de eventos e captura de eventos é todo o conteúdo que compartilhei com você. Espero que possa lhe dar uma referência e espero que você possa apoiar mais o wulin.com.