36

Necesito pasar datos entre dos usuarios autónomos, idealmente sin tocar el objeto unsafeWindow, y pensé que usar eventos personalizados sería el camino a seguir. Pensé en algo como esto (háganos caso omiso del modelo de MSIE para el propósito del ejemplo):¿Hay alguna manera de pasar datos adicionales a través de eventos personalizados?

addEventListener("customEvent", function(e) { 
    alert(e.data); 
}); 

var custom = document.createEvent("HTMLEvents"); 
custom.initEvent("customEvent", true, true); 
custom.data = "Some data..."; 
dispatchEvent(custom); 

Esto funciona muy bien en la norma javascript medio ambiente y dentro de un userscript, pero cuando el evento es disparado por el userscript y atrapado fuera de él o dentro de otro usercript, la propiedad data es undefined en cromo. Supongo que podría guardar los datos pasados ​​en el sessionStorage, pero está lejos de ser perfecto. ¿Alguna otra solución elegante, señores y señoras? La perfección necesita y se puede lograr, puedo sentirlo.

+0

La etiqueta 'google-cromo-extension' ajusta mejor que' elegance'. Atraerá al público correcto;) –

+0

buen pensamiento :) – Witiko

Respuesta

55

Sí, puede usar un MessageEvent o un CustomEvent.

Ejemplo de uso:

//Listen for the event 
window.addEventListener("MyEventType", function(evt) { 
    alert(evt.detail); 
}, false); 

//Dispatch an event 
var evt = new CustomEvent("MyEventType", {detail: "Any Object Here"}); 
window.dispatchEvent(evt); 
+21

Para lograr esto utilizando el 'nuevo constructor CustomEvent ('eventName')', pase los datos en un hash CustomEventInit, codificado por 'detalle' como este: 'nuevo CustomEvent ('eventName', {'detail': data}); '. –

+6

parece que 'initCustomEvent' está en desuso – scrutari

+2

¿Estoy esa información serializada? ¿Puedo poner una referencia a un elemento HTML allí? –

6

objeto pase con más detalles como atributos:

var event = new CustomEvent('build', { 'detail1': "something", detail2: "something else" }); 

function eventHandler(e) { 
    log('detail1: ' + e.detail.detail1); 
    log('detail2: ' + e.detail.detail2); 
} 

https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events

+9

Esto no es JSON: {foo: "bar"} Es un hash de JavaScript. JSON tiene reglas muy estrictas (las claves deben estar entre comillas dobles), e incluso cuando el mismo JS sea JSON válido, usarlo dentro de JS es solo JS y no JSON. En mi opinión, solo es JSON si es JSON válido y está almacenado como una cadena. Cuando se trata de código JS, solo se trata de una estructura de datos de JavaScript que parece parecerse a JSON. –

+0

¿Cuáles son las diferencias exactas entre los objetos hash y Json? Por lo que sé, podemos hacer un hash como var xyz = {}; xyz ['index1'] = "myvalue1"; xyz ['index2'] = "myvalue2"; –

+1

@SujalMandal - la diferencia es que él no está usando el término JSON correctamente en absoluto. Eso no es JSON, es solo un objeto de JavaScript literal. JSON es un formato de ** cadena ** que se utiliza para transferir datos entre programas/datos de la tienda y su sintaxis se basa en gran medida en objetos JavaScript. –

Cuestiones relacionadas