web-dev-qa-db-ja.com

カスタムイベントを介して追加のデータを渡す方法はありますか?

2つのオートノミックユーザースクリプト間でデータを渡す必要があります。理想的にはunsafeWindowオブジェクトに触れないでください。私はこのようなことを考えました(例の目的のためにMSIEモデルを無視しましょう):

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

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

これは、標準のjavascript環境と1つのユーザースクリプト内でうまく機能しますが、イベントがユーザースクリプトによって起動され、その外部または別のユーザースクリプト内でキャッチされると、クロムのdataプロパティはundefinedになります。渡されたデータをsessionStorageに保存することはできると思いますが、シームレスではありません。他のエレガントなソリューション、紳士と紳士はいますか?完璧が必要であり、達成できる、私はそれを感じることができます。

54
Witiko

はい、MessageEventまたは CustomEvent を使用できます。

使用例:

//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);
83
Digital Plane

詳細としてオブジェクトを属性として渡します。

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

8
Amit G