From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../ja/web/api/customevent/customevent/index.html | 104 +++++++++++++++++++++ files/ja/web/api/customevent/index.html | 97 +++++++++++++++++++ 2 files changed, 201 insertions(+) create mode 100644 files/ja/web/api/customevent/customevent/index.html create mode 100644 files/ja/web/api/customevent/index.html (limited to 'files/ja/web/api/customevent') diff --git a/files/ja/web/api/customevent/customevent/index.html b/files/ja/web/api/customevent/customevent/index.html new file mode 100644 index 0000000000..d3d3978993 --- /dev/null +++ b/files/ja/web/api/customevent/customevent/index.html @@ -0,0 +1,104 @@ +--- +title: CustomEvent() +slug: Web/API/CustomEvent/CustomEvent +translation_of: Web/API/CustomEvent/CustomEvent +--- +

{{APIRef("DOM")}}

+ +

CustomEvent() コンストラクターは新しい {{domxref("CustomEvent")}} を生成します。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
 event = new CustomEvent(typeArg, customEventInit);
+ +

引数

+ +
+
typeArg
+
{{domxref("DOMString")}} で、イベントの名前を表します。
+
customEventInit {{optional_inline}}
+
CustomEventInit 辞書で、以下のフィールドを持ちます。 +
    +
  • "detail": 省略可で既定値は null であり、任意の型であり、イベントに関連付けられたイベントに依存する値です。
    • +
+ +
+

CustomEventInit 辞書は、 {{domxref("Event.Event", "EventInit")}} 辞書のフィールドも受け付けます。

+
+
+
+ +

返値

+ +

A new CustomEvent object of the specified type, with any other properties configured according to the CustomEventInit dictionary (if one was provided).

+ +

例

+ +
// add an appropriate event listener
+obj.addEventListener("cat", function(e) { process(e.detail) });
+
+// create and dispatch the event
+var event = new CustomEvent("cat", {
+  detail: {
+    hazcheeseburger: true
+  }
+});
+obj.dispatchEvent(event);
+ +

その他の例は、イベントの作成とトリガにあります。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('DOM WHATWG','#interface-customevent','CustomEvent()')}}{{Spec2('DOM WHATWG')}}初回定義
+ +

ブラウザーの対応

+ + + +

{{Compat("api.CustomEvent.CustomEvent")}}

+ +

ポリフィル

+ +

Internet Explorer 9 以上では、 CustomEvent() の機能を以下のコードで代替することができます。

+ +
(function () {
+
+  if ( typeof window.CustomEvent === "function" ) return false;
+
+  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;
+})();
+ +

Internet Explorer 9 以上では CustomEvent オブジェクトを window に追加していますが、正しい実装では、これは関数です。

+ +

関連情報

+ + diff --git a/files/ja/web/api/customevent/index.html b/files/ja/web/api/customevent/index.html new file mode 100644 index 0000000000..5d08ed2c2f --- /dev/null +++ b/files/ja/web/api/customevent/index.html @@ -0,0 +1,97 @@ +--- +title: CustomEvent +slug: Web/API/CustomEvent +tags: + - API + - CustomEvent + - DOM + - Interface + - NeedsExample + - Reference + - インターフェイス +translation_of: Web/API/CustomEvent +--- +
{{APIRef("DOM")}}
+ +

CustomEvent インターフェイスは、何らかの目的でアプリケーションから初期化されるイベントを表します。

+ +

{{AvailableInWorkers}}

+ +

コンストラクター

+ +
+
{{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}
+
CustomEvent を生成します。
+
+ +

プロパティ

+ +
+
{{domxref("CustomEvent.detail")}} {{readonlyinline}}
+
イベント初期化時にどんなデータでも受け渡すことができます。
+
+ +

このインターフェイスは親である {{domxref("Event")}} からプロパティを継承します

+ +

{{Page("/ja/docs/Web/API/Event", "Properties")}}

+ +

メソッド

+ +
+
{{domxref("CustomEvent.initCustomEvent()")}} {{deprecated_inline}}
+
+

CustomEvent オブジェクトを初期化します。もし該当イベントがすでに移譲されたことがある場合、この関数は何もしません。

+
+
+ +

このインターフェイスは親である {{domxref("Event")}} から関数を継承します。

+ +

{{Page("/ja/docs/Web/API/Event", "Methods")}}

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('DOM WHATWG','#interface-customevent','CustomEvent')}}{{Spec2('DOM WHATWG')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.CustomEvent")}}

+ +

特権を持つコードから持たないコードへのイベント発行

+ +

CustomEvent を特権を持つコード (つまり、エクステンション) から持たないコード (つまり、ウェブページ) へ発行する時、セキュリティの問題を考慮すべきです。Firefox と他の Gecko アプリケーションは、自動的にセキュリティホールを防ぐ為、他者から直接利用される1つのコンテキスト内で作られるオブジェクトを制限します。しかし、この制限によりコードが期待した通りに動作しない可能性があります。

+ +

CustomEvent オブジェクトが作られている間、同じ window からオブジェクトを作る必要があります。作られた CustomEvent の detail 属性は同じ制限の影響を受けるでしょう。制限のないコンテンツからは String と Array の値は読み込み可能ですが、カスタム Object は読み込めません。カスタムオブジェクトを使用している間、Components.utils.cloneInto() を使ってコンテンツのスクリプトから読み込み可能なオブジェクトの属性を定義する必要があるでしょう。

+ +
// doc はコンテンツのドキュメントの参照
+function dispatchCustomEvent(doc) {
+  var eventDetail = Components.utils.cloneInto({foo: 'bar'}, doc.defaultView);
+  var myEvent = doc.defaultView.CustomEvent("mytype", eventDetail);
+  doc.dispatchEvent(myEvent);
+}
+ +

しかし、関数を外部にさらすと、 chrome 特権でコンテンツスクリプトの実行を許可することになり、脆弱性となる可能性があることを覚えておく必要があります。

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf