Este artigo descreve o uso do modelo de evento JavaScript. Compartilhe para sua referência. A análise específica é a seguinte:
1. Modelo de eventos
Bubble: os eventos são passados de nós foliares ao longo do nó ancestral para o nó raiz para cima.
Captura: Do elemento superior da árvore Dom até o elemento mais preciso, oposto ao evento bolha
Modelo de evento padrão DOM: o padrão DOM suporta eventos do tipo bolha e eventos do tipo Capture. Pode-se dizer que é uma combinação dos dois, antes de tudo, da transmissão do tipo Capture e depois do tipo bolha.
2. Objeto de evento
No navegador do IE, o objeto de eventos é uma propriedade da janela. No padrão DOM, o evento deve ser passado para a função de processamento de eventos como um parâmetro exclusivo.
Obtenha um objeto de evento compatível:
function (event) {// Evento é uma função de processamento passada como um parâmetro do Event Standard = Event? Event? Evento: Window.event; }No IE, o objeto do evento está contido no Srcement do evento, enquanto no padrão DOM, o objeto está contido na propriedade de destino
Obtenha o elemento apontado por um objeto de evento compatível:
var no destino = event.srcelement? Event.srcelement: event.target;
A premissa é garantir que o objeto de evento tenha sido obtido corretamente
3. ouvinte de eventos
No IE, o ouvinte registrado é executado em ordem inversa, ou seja, o ouvinte registrado é executado primeiro.
element.attachevent ('OnClick', Observer); // Registre elemento do ouvinte.Detachevent ('OnClick', Observer) // Remova o ouvinteO primeiro parâmetro é o nome do evento, e o segundo é a função de processamento de retorno de chamada
Sob Dom Standard:
Element.AddeventListener ('Click', Observer, Usecapture) element.removeEventListener ('Click', Observer, USECAPTURA)O primeiro parâmetro é o nome do evento, sem o prefixo de "on", o segundo parâmetro é a função de processamento de retorno de chamada e o terceiro parâmetro indica se a função de retorno de chamada é chamada no estágio de captura ou no estágio da bolha. O true padrão é o estágio de captura
4. Entrega de eventos
Cancelar a entrega de eventos no navegador compatível
function somehandler (event) {event = event || Window.Event; if (event.stopPropagation) // dom standard Event.stopPropagation (); else event.cancelbubble = true; // standard}Cancelar o processamento padrão após a entrega do evento
function somehandler (event) {event = event || Window.Event; if (event.preventDefault) // Evento padrão dom. prevenvDefault (); else event.returnValue = true; // standard}Espero que este artigo seja útil para a programação JavaScript de todos.