1. Ventana. Evento
【Instrucciones de análisis】 Mire primero una pieza de código
La copia del código es la siguiente:
función et ()
{
alerta (evento); // es decir: [objeto]
}
El resultado del código anterior que se ejecuta en IE es [objeto], pero no se puede ejecutar en Firefox.
Debido a que el evento se puede usar directamente como una propiedad de un objeto de ventana en IE, pero en Firefox, se usa el modelo W3C, que propaga eventos a través del método de aprobación de parámetros, es decir, debe proporcionar una interfaz de respuesta de evento para su función.
[Procesamiento de compatibilidad] Agregue el juicio del evento y obtenga el evento correcto de acuerdo con el navegador:
La copia del código es la siguiente:
función et ()
{
evt = evt? Evt: (Window.event? Window.event: null);
// Compatible con IE y Firefox
alerta (EVT);
}
2. Adquisición del valor del teclado
[Nota de análisis] Los métodos para obtener valores de teclado de IE y Firefox son diferentes. Se puede entender que el evento, que bajo Firefox, es equivalente al evento. Para las diferencias de los demás, consulte "Prueba de compatibilidad para el código de teclas, que y encarcelado en eventos de teclado"
【Procesamiento compatible】
Copiar el código
La copia del código es la siguiente:
Funcionar myKeyPress (EVT) {
// Compatible con IE y Firefox para obtener el objeto de eventos de teclado
EVT = (EVT)? EVT: ((Window.event)? Window.event: "")
// Compatible con IE y Firefox para obtener el valor de tecla del objeto TeyboardEvent
var key = evt.keycode? Evt.KeyCode: evt.whhch;
if (evt.ctrlkey && (key == 13 || key == 10)) {
// ctrl y enter se presionaron al mismo tiempo
// hacer algo;
}
}
3. Obtener fuente de eventos
[Nota de análisis] Al usar delegados de eventos, podemos determinar de qué elemento proviene el evento a través de la adquisición de la fuente del evento. Sin embargo, en IE, el objeto del evento tiene una propiedad de Cicelement, pero no hay propiedad objetivo; En Firefox, el objeto uniforme tiene una propiedad objetivo, pero no hay propiedad de Cicelement.
【Procesamiento compatible】
La copia del código es la siguiente:
ele = function (evt) {// captura el objeto que el evento actual está actuando
evt = evt || window.event;
Devolver
(obj = Event.SrCelement? Event.srcelement: Event.target;);
}
4. Monitoreo de eventos
[Nota de análisis] En términos de escucha y procesamiento de eventos, IE proporciona dos interfaces: adjunta de eventos y separados, mientras que Firefox proporciona AddEventListener y RemoLEventListener.
[Procesamiento de compatibilidad] El procesamiento de compatibilidad más simple es encapsular estos dos conjuntos de interfaces:
La copia del código es la siguiente:
función addEvent (elem, eventname, handler) {
if (elem.attachevent) {
elem.attachevent ("on" + eventname, function () {
handler.call (elem)});
// Use la función de devolución de llamada Llame () aquí, deje que este punto sea ELEM
} else if (elem.addeventListener) {
Elem.addeventListener (EventName, Handler, False);
}
}
Función RemoLeVent (Elem, EventName, Handler) {
if (elem.detachevent) {
elem.detachevent ("on" + eventname, function () {
handler.call (elem)});
// Use la función de devolución de llamada Llame () aquí, deje que este punto sea ELEM
} else if (elem.removeEventListener) {
elem.removeEventListener (EventName, Handler, False);
}
}
Cabe señalar que bajo Firefox, esto en el evento de manejo de eventos apunta al elemento escuchado en sí, pero en IE, puede usar la llamada de función de devolución de llamada para que el contexto actual apunte al elemento escuchado.
5. Posición del mouse
[Nota de análisis] En IE, el objeto uniforme tiene atributos X e Y, pero no hay atributos Pagex y Pagey; Bajo Firefox, el objeto uniforme tiene atributos Pagex y Pagey, pero no hay atributos X e Y.
[Procesamiento de compatibilidad] Use mx (mx = event.x? Event.x: event.pagex;) para reemplazar event.x en IE o event.pagex en Firefox. La posición absoluta debe considerarse para puntos complejos.
La copia del código es la siguiente:
función getabSpoint (e) {
var x = e.offsetleft, y = e.offsettop;
while (e = e.offsetParent) {
x += e.offsetleft;
y += e.offsettop;
}
alerta ("x:" + x + "," + "y:" + y);
}