aboutsummaryrefslogtreecommitdiff
path: root/files/zh-cn/web/api/customevent/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/zh-cn/web/api/customevent/index.html')
-rw-r--r--files/zh-cn/web/api/customevent/index.html148
1 files changed, 148 insertions, 0 deletions
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
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p><code>CustomEvent </code>事件是由程序创建的,可以有任意自定义功能的事件。</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h2 id="构造函数">构造函数</h2>
+
+<p><strong style="font-weight: bold;">{{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}  </strong>创建一个自定义事件。</p>
+
+<h2 id="属性">属性</h2>
+
+<p><strong style="font-weight: bold;">{{domxref("CustomEvent.detail")}} {{readonlyinline}} 任何时间初始化时传入的数据</strong></p>
+
+<p><em>此接口从父接口继承属性, </em>{{domxref("Event")}}:</p>
+
+<p>{{Page("/en-US/docs/Web/API/Event", "Properties")}}</p>
+
+<h2 id="方法">方法</h2>
+
+<p> </p>
+
+<dl>
+ <dt>{{domxref("CustomEvent.initCustomEvent()")}} {{deprecated_inline}}</dt>
+ <dd>
+ <p>初始化一个<code>CustomEvent 对象.如果事件已经被触发,这个方法不起任何作用.</code></p>
+ </dd>
+</dl>
+
+<p><em>此接口从父接口继承方法, </em>{{domxref("Event")}}:</p>
+
+<p>{{Page("/en-US/docs/Web/API/Event", "Methods")}}</p>
+
+<p> </p>
+
+<h2 id="Method_overview" name="Method_overview">方法概述</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <td><code>void <a href="#initCustomEvent()">initCustomEvent</a>(in DOMString type, in boolean canBubble, in boolean cancelable, in any detail);</code></td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Attributes" name="Attributes">属性</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th>Attribute</th>
+ <th>Type</th>
+ <th>Description</th>
+ </tr>
+ <tr>
+ <td><code>detail</code></td>
+ <td><code>any</code></td>
+ <td>当事件初始化时传递的数据</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Methods" name="Methods">方法</h2>
+
+<h3 id="initCustomEvent()" name="initCustomEvent()">initCustomEvent()</h3>
+
+<p>初始化一个自定义事件的方式和初始化一个标准DOM事件的方式非常相似.</p>
+
+<pre class="eval">void initCustomEvent(
+ in DOMString type,
+ in boolean canBubble,
+ in boolean cancelable,
+ in any detail
+);
+</pre>
+
+<h4 id="Parameters" name="Parameters">参数</h4>
+
+<dl>
+ <dt><code>type</code></dt>
+ <dd>事件的类型名称.</dd>
+ <dt><code>canBubble</code></dt>
+ <dd>一个布尔值,表明该事件是否会冒泡.</dd>
+ <dt><code>cancelable</code></dt>
+ <dd>一个布尔值,表明该事件是否可以被取消.</dd>
+ <dt><code>detail</code></dt>
+ <dd>当事件初始化时传递的数据.</dd>
+</dl>
+
+<h2 id="构造函数_2">构造函数</h2>
+
+<p><a class="external" href="http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html">DOM4 规范</a> 添加了对 <code>CustomEvent</code> 构造函数的支持.</p>
+
+<pre>CustomEvent(
+ DOMString type,
+ optional CustomEventInit eventInitDict
+)
+</pre>
+
+<h3 id="Parameters" name="Parameters">参数</h3>
+
+<dl>
+ <dt><code>type</code></dt>
+ <dd>事件的类型名称.</dd>
+ <dt><code>eventInitDict</code></dt>
+ <dd>一个对象,提供了事件的配置信息.查看<a href="#CustomEventInit">CustomEventInit</a>了解更多详情.</dd>
+</dl>
+
+<h4 id="CustomEventInit" name="CustomEventInit">CustomEventInit</h4>
+
+<dl>
+ <dt><code>bubbles</code></dt>
+ <dd>一个布尔值,表明该事件是否会冒泡.</dd>
+ <dt><code>cancelable</code></dt>
+ <dd>一个布尔值,表明该事件是否可以被取消.</dd>
+ <dt><code>detail</code></dt>
+ <dd>当事件初始化时传递的数据.</dd>
+</dl>
+
+<h3 id="CustomEvent_example_usage" name="CustomEvent_example_usage">CustomEvent用法示例</h3>
+
+<p></p>
+
+<pre class="brush: js">// 添加一个适当的事件监听器
+obj.addEventListener("cat", function(e) { process(e.detail) })
+
+// 创建并分发事件
+var event = new CustomEvent("cat", {"detail":{"hazcheeseburger":true}})
+obj.dispatchEvent(event)
+</pre>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">浏览器兼容性</h2>
+
+
+
+<p>{{Compat("api.CustomEvent")}}</p>
+
+<h2 id="Specification" name="Specification">规范</h2>
+
+<ul>
+ <li>{{ spec("http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#interface-customevent","DOM4 : Interface CustomEvent","ED") }}</li>
+ <li>{{ spec("http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html#interface-CustomEvent","DOM Level 3 Events : CustomEvent","WD") }}</li>
+</ul>