2 files changed, 178 insertions, 0 deletions
diff --git a/files/zh-tw/web/api/customevent/customevent/index.html b/files/zh-tw/web/api/customevent/customevent/index.html
new file mode 100644
index 0000000000..0accf247e5
--- /dev/null
+++ b/files/zh-tw/web/api/customevent/customevent/index.html
@@ -0,0 +1,90 @@
+---
+title: CustomEvent()
+slug: Web/API/CustomEvent/CustomEvent
+translation_of: Web/API/CustomEvent/CustomEvent
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p><code><strong>CustomEvent()</strong></code> constructor 可用來建立 {{domxref("CustomEvent")}}.</p>
+
+<h2 id="語法">語法</h2>
+
+<pre class="syntaxbox"> <em>event</em> = new CustomEvent(<em>typeArg</em>, <em>customEventInit</em>);</pre>
+
+<h3 id="參數">參數</h3>
+
+<dl>
+ <dt><em>typeArg</em></dt>
+ <dd>一個 {{domxref("DOMString")}} 用來表示事件名稱。</dd>
+ <dt><em>customEventInit</em>{{optional_inline}}</dt>
+ <dd>Is a <code>CustomEventInit</code> dictionary, having the following fields:
+ <ul>
+  <li><code>"detail"</code>, optional and defaulting to <code>null</code>, of type any, that is a event-dependant value associated with the event.</li>
+ </ul>
+
+ <div class="note">
+ <p><em>The <code>CustomEventInit</code></em><em> dictionary also accepts fields from the {{domxref("Event.Event", "EventInit")}} dictionary.</em></p>
+ </div>
+ </dd>
+</dl>
+
+<h2 id="範例">範例</h2>
+
+<pre class="brush: js">// 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);</pre>
+
+<h2 id="規格">規格</h2>
+
+<table class="standard-table" style="height: 49px; width: 1000px;">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#interface-customevent','CustomEvent()')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器支援度">瀏覽器支援度</h2>
+
+
+
+<p>{{Compat("api.CustomEvent.CustomEvent")}}</p>
+
+<h2 id="添加額外參數">添加額外參數</h2>
+
+<p>在 Internet Explorer 9 或更高的版本，你可以用以下的方法給 <code>CustomEvent()</code> constructor 添加額外參數</p>
+
+<pre class="brush: js">(function () {
+  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;
+})();</pre>
+
+<h2 id="延伸閱讀">延伸閱讀</h2>
+
+<ul>
+ <li>{{domxref("CustomEvent")}}</li>
+</ul>
diff --git a/files/zh-tw/web/api/customevent/index.html b/files/zh-tw/web/api/customevent/index.html
new file mode 100644
index 0000000000..e35df7df2e
--- /dev/null
+++ b/files/zh-tw/web/api/customevent/index.html
@@ -0,0 +1,88 @@
+---
+title: CustomEvent
+slug: Web/API/CustomEvent
+tags:
+  - 待翻譯
+translation_of: Web/API/CustomEvent
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p><strong><code>CustomEvent</code></strong> interface 是應用程式為了任意目的所初始化的事件。</p>
+
+<h2 id="建構式">建構式</h2>
+
+<dl>
+ <dt>{{domxref("CustomEvent.CustomEvent", "CustomEvent()")}}</dt>
+ <dd>建立一個 <code>CustomEvent。</code></dd>
+</dl>
+
+<h2 id="屬性">屬性</h2>
+
+<dl>
+ <dt>{{domxref("CustomEvent.detail")}} {{readonlyinline}}</dt>
+ <dd>初始化事件時傳送的任意資料。</dd>
+</dl>
+
+<p><em>此介面繼承了其父介面 {{domxref("Event")}} 的屬性：</em></p>
+
+<p>{{Page("/zh-TW/docs/Web/API/Event", "屬性")}}</p>
+
+<h2 id="方法">方法</h2>
+
+<dl>
+ <dt>{{domxref("CustomEvent.initCustomEvent()")}} {{deprecated_inline}}</dt>
+ <dd>
+ <p>初始化一 <code>CustomEvent</code> object。若該事件已經被觸發，則不會進行任何動作。</p>
+ </dd>
+</dl>
+
+<p><em>此介面繼承了其父介面 {{domxref("Event")}} 的方法：</em></p>
+
+<p>{{Page("/zh-TW/docs/Web/API/Event", "方法")}}</p>
+
+<h2 id="規格">規格</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#interface-customevent','CustomEvent')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>原始定義</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器兼容性">瀏覽器兼容性</h2>
+
+
+
+<p>{{Compat("api.CustomEvent")}}</p>
+
+<h2 id="Firing_from_privileged_code_to_non-privileged_code">Firing from privileged code to non-privileged code</h2>
+
+<p>當要從 privileged code （像是插件）到非 privileged code （例如網頁）執行 CustomEvent ，你必須要考慮這之間的安全性。Firefox 和其他 Gecko 應用會對此有所限制。雖然這可以自動防止安全漏洞發生，但也可能導致您的程式碼沒辦法正常執行。</p>
+
+<p>When creating a CustomEvent object, you must create the object from the same <a href="/en-US/docs/XUL/window">window</a> as you're going to fire against. The <code>detail</code> attribute of your CustomEvent will be subject to the same restrictions. String and Array values will be readable by the content without restrictions, but custom Objects will not. If using a custom Object, you will need to define the attributes of that object that are readable from the content script using <a href="/en-US/docs/">Components.utils.cloneInto()</a>.</p>
+
+<pre class="brush: js">// doc is a reference to the content document
+function dispatchCustomEvent(doc) {
+  var eventDetail = Components.utils.cloneInto({foo: 'bar'}, doc.defaultView);
+  var myEvent = doc.defaultView.CustomEvent("mytype", eventDetail);
+  doc.dispatchEvent(myEvent);
+}</pre>
+
+<p>Note that exposing a function will allow the content script to run it with chrome privileges, which can open a security vulnerability.</p>
+
+<h2 id="參見">參見</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Code_snippets/Interaction_between_privileged_and_non-privileged_pages" title="/en-US/docs/Code_snippets/Interaction_between_privileged_and_non-privileged_pages">Interaction between privileged and non-privileged pages</a></li>
+ <li><a href="/en-US/docs/Web/API/window.postMessage" title="/en-US/docs/Web/API/window.postMessage">Window.postMessage</a></li>
+</ul>