對話方塊元素 - 簡化視窗

Eiji Kitamura

Twitter GitHub Glitch Mastodon

Chrome Canary 原本支援對話方塊元素，而且是透過旗標進行。dialog 元素可用於網頁上的彈出式視窗。

• show()：開啟對話方塊。
• close()：關閉對話方塊。採用選用引數，如果存在的 dialog.returnValue 已設定為
• showModal()：開啟互動視窗對話方塊。
• ::backdrop：用來設定強制回應對話方塊後方背景的虛擬元素。
• close 事件：在對話方塊關閉時觸發。

2013 年 12 月 16 日更新

dialog 元素現在支援：

• cancel 事件：在強制回應對話方塊按下 Escape 鍵時觸發。你可以使用 event.preventDefault() 取消這場活動。
• autofocus 屬性：含有 autofocus 屬性的強制回應對話方塊中的第一個表單控制項 (如有) 會在顯示對話方塊時聚焦。如果沒有這類元素，則將焦點移至第一個可聚焦的元素。
• form[method="dialog"]：僅在對話方塊中有效。提交表單後，系統會關閉對話方塊，並將 dialog.returnValue 設為使用的提交按鈕值。

透過即時示範和 polyfill 查看詳細資訊。

你可以前往 chrome://flags/ 啟用「啟用實驗性網路平台功能」來啟用這項功能。