From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../web/api/customevent/customevent/index.html | 114 ++++++++++++++++ files/zh-cn/web/api/customevent/detail/index.html | 68 ++++++++++ files/zh-cn/web/api/customevent/index.html | 148 +++++++++++++++++++++ .../web/api/customevent/initcustomevent/index.html | 110 +++++++++++++++ 4 files changed, 440 insertions(+) create mode 100644 files/zh-cn/web/api/customevent/customevent/index.html create mode 100644 files/zh-cn/web/api/customevent/detail/index.html create mode 100644 files/zh-cn/web/api/customevent/index.html create mode 100644 files/zh-cn/web/api/customevent/initcustomevent/index.html (limited to 'files/zh-cn/web/api/customevent') diff --git a/files/zh-cn/web/api/customevent/customevent/index.html b/files/zh-cn/web/api/customevent/customevent/index.html new file mode 100644 index 0000000000..e9428f608e --- /dev/null +++ b/files/zh-cn/web/api/customevent/customevent/index.html @@ -0,0 +1,114 @@ +--- +title: CustomEvent() +slug: Web/API/CustomEvent/CustomEvent +translation_of: Web/API/CustomEvent/CustomEvent +--- +

{{APIRef("DOM")}}

+ +

The CustomEvent() constructor creates a new {{domxref("CustomEvent")}}.

+ +

构造方法 CustomerEvent() 创建一个新的 {{domxref("CustomEvent")}} 对象。

+ +

Syntax 语法

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

Values 参数

+ +
+
typeArg
+
Is a {{domxref("DOMString")}} representing the name of the event.
+
一个表示 event 名字的字符串
+
customEventInit{{optional_inline}}
+
+ +
+
Is a CustomEventInit dictionary, having the following fields:  一个字典类型参数，有如下字段 + +
    +
  • "detail", optional and defaulting to null, of type any, that is a event-dependant value associated with the event.   可选的默认值是 null 的任意类型数据，是一个与 event 相关的值
    • +
  • bubbles 一个布尔值，表示该事件能否冒泡。 来自 {{domxref("Event.Event", "EventInit")}}。注意：测试chrome默认为不冒泡。
    • +
  • cancelable 一个布尔值，表示该事件是否可以取消。 来自 {{domxref("Event.Event", "EventInit")}}
    • +
+ +
+

The CustomEventInit dictionary also accepts fields from the {{domxref("Event.Event", "EventInit")}} dictionary.

+ +

CustomerEventInit 字典参数同样接受来自于 Event 类构造函数的 eventInit 字典参数，如下

+ +

bubbles   一个布尔值，表示该事件能否冒泡

+ +

cancelable  一个布尔值，表示该事件是否可以取消

+
+
+
+ +

Example

+ +
// 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);
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM WHATWG','#interface-customevent()','CustomEvent()')}}{{Spec2('DOM WHATWG')}}Initial definition.
+ +

Browser compatibility

+ + + +

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

+ +

Polyfill

+ +

You can polyfill the CustomEvent() constructor functionality in Internet Explorer 9 and higher with the following code:

+ +
(function(){
+    try{
+        // a : While a window.CustomEvent object exists, it cannot be called as a constructor.
+        // b : There is no window.CustomEvent object
+        new window.CustomEvent('T');
+    }catch(e){
+        var CustomEvent = function(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;
+    }
+})();
+ +

See also

+ + diff --git a/files/zh-cn/web/api/customevent/detail/index.html b/files/zh-cn/web/api/customevent/detail/index.html new file mode 100644 index 0000000000..c70a7655bf --- /dev/null +++ b/files/zh-cn/web/api/customevent/detail/index.html @@ -0,0 +1,68 @@ +--- +title: CustomEvent.detail +slug: Web/API/CustomEvent/detail +translation_of: Web/API/CustomEvent/detail +--- +

{{APIRef("DOM")}}

+ +

接口 {{domxref("CustomEvent")}} 的只读属性 detail （详情）返回在初始化事件对象时传递过来的任何类型数据。

+ +

{{AvailableInWorkers}}

+ +

Syntax

+ +
 let myDetail = customEventInstance.detail;
+ +

Return value

+ +

事件对象初始化时传递的任何类型数据。

+ +

Example

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

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM WHATWG','#dom-customeventinit-detail','detail')}}{{Spec2('DOM WHATWG')}}Initial definition.
+ +

Browser compatibility

+ + + +

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

+ +

See also

+ + + +

 

diff --git a/files/zh-cn/web/api/customevent/index.html b/files/zh-cn/web/api/customevent/index.html new file mode 100644 index 0000000000..150dcc5ac3 --- /dev/null +++ b/files/zh-cn/web/api/customevent/index.html @@ -0,0 +1,148 @@ +--- +title: CustomEvent +slug: Web/API/CustomEvent +translation_of: Web/API/CustomEvent +--- +

{{APIRef("DOM")}}

+ +

CustomEvent 事件是由程序创建的，可以有任意自定义功能的事件。

+ +

{{AvailableInWorkers}}

+ +

构造函数

+ +

{{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}  创建一个自定义事件。

+ +

属性

+ +

{{domxref("CustomEvent.detail")}} {{readonlyinline}} 任何时间初始化时传入的数据

+ +

此接口从父接口继承属性, {{domxref("Event")}}:

+ +

{{Page("/en-US/docs/Web/API/Event", "Properties")}}

+ +

方法

+ +

 

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

初始化一个CustomEvent 对象.如果事件已经被触发,这个方法不起任何作用.

+
+
+ +

此接口从父接口继承方法, {{domxref("Event")}}:

+ +

{{Page("/en-US/docs/Web/API/Event", "Methods")}}

+ +

 

+ +

方法概述

+ + + + + + + +
void initCustomEvent(in DOMString type, in boolean canBubble, in boolean cancelable, in any detail);
+ +

属性

+ + + + + + + + + + + + + + +
AttributeTypeDescription
detailany当事件初始化时传递的数据
+ +

方法

+ +

initCustomEvent()

+ +

初始化一个自定义事件的方式和初始化一个标准DOM事件的方式非常相似.

+ +
void initCustomEvent(
+  in DOMString type,
+  in boolean canBubble,
+  in boolean cancelable,
+  in any detail
+);
+
+ +

参数

+ +
+
type
+
事件的类型名称.
+
canBubble
+
一个布尔值,表明该事件是否会冒泡.
+
cancelable
+
一个布尔值,表明该事件是否可以被取消.
+
detail
+
当事件初始化时传递的数据.
+
+ +

构造函数

+ +

DOM4 规范 添加了对 CustomEvent 构造函数的支持.

+ +
CustomEvent(
+  DOMString type,
+  optional CustomEventInit eventInitDict
+)
+
+ +

参数

+ +
+
type
+
事件的类型名称.
+
eventInitDict
+
一个对象,提供了事件的配置信息.查看CustomEventInit了解更多详情.
+
+ +

CustomEventInit

+ +
+
bubbles
+
一个布尔值,表明该事件是否会冒泡.
+
cancelable
+
一个布尔值,表明该事件是否可以被取消.
+
detail
+
当事件初始化时传递的数据.
+
+ +

CustomEvent用法示例

+ +

+ +
// 添加一个适当的事件监听器
+obj.addEventListener("cat", function(e) { process(e.detail) })
+
+// 创建并分发事件
+var event = new CustomEvent("cat", {"detail":{"hazcheeseburger":true}})
+obj.dispatchEvent(event)
+
+ +

浏览器兼容性

+ + + +

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

+ +

规范

+ + diff --git a/files/zh-cn/web/api/customevent/initcustomevent/index.html b/files/zh-cn/web/api/customevent/initcustomevent/index.html new file mode 100644 index 0000000000..2b8b12aea8 --- /dev/null +++ b/files/zh-cn/web/api/customevent/initcustomevent/index.html @@ -0,0 +1,110 @@ +--- +title: CustomEvent.initCustomEvent() +slug: Web/API/CustomEvent/initCustomEvent +translation_of: Web/API/CustomEvent/initCustomEvent +--- +

{{APIRef("DOM")}}{{deprecated_header}}

+ +

CustomEvent.initCustomEvent() 方法初始化了一个 CustomEvent object. 如果该事件已经被分发出去，则不会在初始化过程中重复触发．

+ +

这类对象一定是由 {{ domxref("Document.createEvent()") }} 方法创建的. 该方法被分发之前必须通过{{ domxref("EventTarget.dispatchEvent()") }}方法设置．一旦被分发则，则无法被重新设置．

+ +
+

该方法已经作废，不要在新项目中继续使用该方法.

+ +

Instead use specific event constructors, like {{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}. The page on Creating and triggering events gives more information about the way to use these.

+
+ +

Syntax

+ +
event.initCustomEvent(type, canBubble, cancelable, detail);
+
+ +

Parameters

+ +
+
type
+
类型{{domxref("DOMString")}}，事件名称.
+
canBubble
+
类型{{jsxref("Boolean")}}，事件是否沿着dom树向上冒泡.
+
cancelable
+
类型{{jsxref("Boolean")}}，事件是否可取消.
+
detail
+
事件初始化时传入的数据.
+
+ +

Specifications

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('DOM WHATWG','#dom-customevent-initcustomevent','CustomEvent')}}{{Spec2('DOM WHATWG')}}Initial definition, but already deprecated in favor of the use of a constructor, {{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}
+ +

Browser compatibility

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{ CompatVersionUnknown() }}{{CompatGeckoDesktop(6)}}9115.1 (533.3)
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{ CompatUnknown() }}{{CompatGeckoMobile(6)}}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+ +

See also

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