HTMLCanvasElement：contextlost 事件

可用性有限

此特性不是基线特性，因为它在一些最广泛使用的浏览器中不起作用。

当用户代理检测到与 CanvasRenderingContext2D 上下文关联的后备存储丢失时，会触发 contextlost 事件，它是 Canvas API 的一部分。上下文可能由于多种原因丢失，例如驱动程序崩溃、应用程序内存不足等。

默认情况下，用户代理会尝试恢复上下文，然后触发 contextrestored 事件。用户代码可以通过在事件处理期间调用 Event.preventDefault() 来阻止恢复上下文。

语法

在诸如 addEventListener() 之类的方法中使用事件名称，或设置事件处理程序属性。

addEventListener("contextlost", (event) => { })

oncontextlost = (event) => { }

一个通用的 Event。

以下代码片段会检测 contextlost 事件。

const canvas = document.getElementById("canvas");

canvas.addEventListener("contextlost", (event) => {
  console.log(event);
});

如果想阻止上下文被恢复，代码可能看起来像这样：

const canvas = document.getElementById("canvas");

canvas.addEventListener("contextlost", (event) => {
  event.preventDefault();
});

规范
HTML # event-contextlost

本页面最后修改时间为 2025 年 9 月 25 日，由 MDN 贡献者修改。