CloseWatcher: cancel 事件

可用性有限

此特性不是基線特性,因為它在一些最廣泛使用的瀏覽器中不起作用。

實驗性: 這是一項實驗性技術
在生產中使用此技術之前,請仔細檢查瀏覽器相容性表格

close 事件之前,會向 CloseWatcher 物件觸發一個 cancel 事件,以便在必要時阻止 close 事件的觸發。它由所有關閉訊號(例如,Esc 鍵)以及 CloseWatcher.requestClose() 觸發。

語法

在諸如 addEventListener() 之類的方法中使用事件名稱,或設定事件處理程式屬性。

js
addEventListener("cancel", (event) => { })

oncancel = (event) => { }

事件型別

一個 Event 物件。

示例

使用 cancel 事件

在此示例中,我們要求使用者確認他們是否真的想關閉元件,如果他們不想關閉,我們就使用 Event.preventDefault() 取消該事件,這會阻止 close 事件的觸發。

js
watcher.addEventListener("cancel", (e) => {
  if (e.cancelable && hasUnsavedData) {
    const userReallyWantsToClose = confirm("Are you sure you want to close?");
    if (!userReallyWantsToClose) {
      e.preventDefault();
    }
  }
});

// Trigger a close request manually
watcher.requestClose();

規範

規範
HTML
# handler-closewatcher-oncancel

瀏覽器相容性