error

当一个资源加载失败或无法使用时,会在Element对象上触发error事件。例如当脚本执行错误、或图片无法找到或图片无效时。

Bubbles(支持冒泡) No
Cancelable(可撤销) No
Interface(接口) EventUIEvent
Event handler property(事件处理程序属性) onerror

如果事件对象是从用户界面元素生成的,则它是一个UIEvent实例;反之,它是一个Event实例。

示例

在线示例

HTML

html
<div class="controls">
  <button id="img-error" type="button">生成图像 error</button>
  <img class="bad-img" />
</div>

<div class="event-log">
  <label>Event log:</label>
  <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea>
</div>

JS

js
const log = document.querySelector(".event-log-contents");

const badImg = document.querySelector(".bad-img");
badImg.addEventListener("error", (event) => {
  log.textContent = log.textContent + `${event.type}: Loading image\n`;
  console.log(event);
});

const imgError = document.querySelector("#img-error");
imgError.addEventListener("click", () => {
  badImg.setAttribute("src", "i-dont-exist");
});

结果

规范

Specification
UI Events
# event-type-error

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
error event

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

参阅

  • This event on Window targets: error event