Window: error 事件
當資源載入失敗或無法使用時（例如指令碼執行錯誤），會在 Window 物件上觸發 error 事件。
此事件僅針對同步丟擲的指令碼錯誤生成，例如在初始載入期間或事件處理程式內部。如果 Promise 被拒絕（包括 async function 中未捕獲的 throw）並且沒有附加拒絕處理程式，則會觸發 unhandledrejection 事件。
語法
在諸如 addEventListener() 之類的方法中使用事件名稱，或設定事件處理程式屬性。
addEventListener("error", (event) => { })
onerror = (message, source, lineno, colno, error) => { }
注意：出於歷史原因，Window 和 WorkerGlobalScope 物件上的 onerror 是唯一接收多個引數的事件處理程式屬性。
事件型別
如果事件物件是由使用者介面元素生成的，則它是 ErrorEvent 例項，否則它是 Event 例項。
描述
事件處理程式屬性
出於歷史原因，僅在 Window 和 WorkerGlobalScope 物件上的 onerror 事件處理程式屬性與其他事件處理程式屬性具有不同的行為。
請注意，這僅適用於分配給 onerror 的處理程式，而不適用於使用 addEventListener() 新增的處理程式。
取消
大多數分配給事件處理程式屬性的事件處理程式可以透過從處理程式返回 false 來取消事件的預設行為
textarea.onkeydown = () => false;
但是，對於事件處理程式屬性要取消 Window 的 error 事件的預設行為，它必須返回 true
window.onerror = () => true;
取消後，錯誤將不會出現在控制檯中，但當前指令碼仍將停止執行。
引數
事件處理程式的簽名在 addEventListener() 和 onerror 之間是不對稱的。傳遞給 Window.addEventListener() 的事件處理程式接收單個 ErrorEvent 物件，而 onerror 處理程式接收五個引數，與 ErrorEvent 物件的屬性匹配
message-
一個包含描述問題的人類可讀錯誤訊息的字串。與
ErrorEvent.message相同。注意：在 HTML 中，內容事件處理程式屬性
<body>元素上的onerror會將error事件監聽器附加到window（不是<body>元素）。對於此事件處理程式，第一個引數稱為event，而不是message，儘管它仍然包含一個字串；也就是說，您將使用<body onerror="console.error(event)">來記錄錯誤訊息。 source-
一個包含生成錯誤的指令碼 URL 的字串。
行號-
一個整數，包含發生錯誤的指令碼檔案的行號。
colno-
一個整數，包含發生錯誤的指令碼檔案的列號。
error-
被丟擲的錯誤。通常是一個
Error物件。
window.onerror = (a, b, c, d, e) => {
console.log(`message: ${a}`);
console.log(`source: ${b}`);
console.log(`lineno: ${c}`);
console.log(`colno: ${d}`);
console.log(`error: ${e}`);
return true;
};
注意：這些引數名稱可以透過 HTML 事件處理程式屬性觀察到，其中第一個引數稱為 event 而不是 message。
這種特殊行為僅發生在 window 上的 onerror 事件處理程式。 Element.onerror 處理程式仍然接收單個 ErrorEvent 物件。
示例
即時示例
HTML
<div class="controls">
<button id="script-error" type="button">Generate script error</button>
<img class="bad-img" />
</div>
<div class="event-log">
<label for="eventLog">Event log:</label>
<textarea
readonly
class="event-log-contents"
rows="8"
cols="30"
id="eventLog"></textarea>
</div>
JavaScript
const log = document.querySelector(".event-log-contents");
window.addEventListener("error", (event) => {
log.textContent = `${log.textContent}${event.type}: ${event.message}\n`;
console.log(event);
});
const scriptError = document.querySelector("#script-error");
scriptError.addEventListener("click", () => {
const badCode = "const s;";
eval(badCode);
});
結果
規範
| 規範 |
|---|
| HTML # 事件-錯誤 |
| HTML # 處理程式-onerror |
瀏覽器相容性
載入中…
另見
Element上的此事件的目標：error事件Window:unhandledrejection事件