sintaxis - eventos javascript onclick

¿Por qué mis parámetros no se pasan a un evento distribuido?

Question

Ok, así que he creado una escucha de eventos como esta ...

window.addEventListener(''message'', parseMessage, false);
var parseMessage = function(rawMessage) {
console.log(rawMessage.cmd);
};

Y luego estoy activando el evento de esta manera:

var event = new Event(''message'', {''cmd'':"blerg!"});
window.dispatchEvent(event);

El problema es que la consola.log en el mensaje de análisis se está desconectando de forma indefinida cuando estoy esperando cerrar sesión "blerg!"

¿Qué estoy haciendo mal aquí con los eventos, cómo paso el mensaje ''cmd'' al evento?

Answer 1

1. Use developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Events/… lugar de Event para crear eventos personalizados.

2. Especifique sus datos en un objeto ''detalles'' (ver código).

3. Cambié el nombre del evento porque el message también se usa para la API postMessage . No causó problemas al ejecutar Chrome, pero no lo usaría.

var parseMessage = function(rawMessage) {
console.log(rawMessage);
console.log(rawMessage.detail.cmd);
};
// changed event name
window.addEventListener(''myMessage'', parseMessage, false);
// data should be in a ''details'' object
var evt = new CustomEvent(''myMessage'', {
detail: {
''cmd'' : "blerg!"
}
});
window.dispatchEvent(evt);

Aquí hay un ajuste para compatibilidad IE> = 9 (usando document.createEvent() y CustomEvent::initCustomEvent() ):

var evt = document.createEvent("CustomEvent");
evt.initCustomEvent(''myMessage'', false, false, {
''cmd'': "blerg!"
});

Answer 2

Para el polyfill IE9 / 10 puede usar este código provisto por Mozilla:
https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent

(function () {
if (
typeof window.CustomEvent === "function" ||
// In Safari, typeof CustomEvent == ''object'' but it otherwise works fine
this.CustomEvent.toString().indexOf(''CustomEventConstructor'')>-1
) { return; }
function CustomEvent ( event, params ) {
params = params || { bubbles: false, cancelable: false, detail: undefined };
var evt = document.createEvent( ''CustomEvent'' );
evt.initCustomEvent( event, params.bubbles, params.cancelable, params.detail );
return evt;
}
CustomEvent.prototype = window.Event.prototype;
window.CustomEvent = CustomEvent;
})();

También se describe aquí, pero con la URL incorrecta: https://.com/a/22946340/1736012