HTML怎么用空函数切断onerror死循环-html教程-PHP中文网

onerror死循环是因为错误回调中未切断触发链，导致备用资源再失败时重复调用自身；必须立即解绑onerror、设置降级标记或清空src后换新URL才能终止。

html怎么用空函数切断onerror死循环

为什么 `onerror` 会死循环

当图片、脚本等资源加载失败，浏览器触发 onerror 回调；如果回调里又尝试加载同一个失败资源（比如重试 img.src），而新赋值仍失败，就会再次触发 onerror——形成无限递归。常见于未做加载状态标记或错误兜底的“自动重试”逻辑。

空函数本身不能切断死循环

写成 img.onerror = function() {} 或 img.onerror = () => {} 确实能阻止后续报错输出，但**它只屏蔽了错误处理逻辑，并不改变资源加载行为本身**。如果之前代码在 onerror 里写了 img.src = img.src 这类操作，空函数挡不住这行代码执行，死循环照旧。

真正起作用的是：在进入错误处理前，先确保不会重复触发加载动作。关键点有：

用布尔标记（如 isRetrying）阻止二次赋值
清空或重置 src 再赋新值（避免浏览器复用缓存失败状态）
错误回调中立即解绑自身（event.target.onerror = null），最稳妥

`onerror` 中立即解绑自己最可靠

这是兼容性好、逻辑清晰、无副作用的做法。解绑后即使后续代码再触发加载失败，也不会再次进入该回调。

@@##@@
<script>
const img = document.getElementById('myImg');
img.onerror = function() {
  // 先解绑，防止任何后续触发
  this.onerror = null;
  // 再加载备用图（注意：不要用 this.src = this.src）
  this.src = '/fallback.png';
};
</script>

注意：this.src = this.src 是高危写法——多数浏览器会直接复用上次失败状态，立刻再次触发 onerror，哪怕你刚解绑。改用明确的新 URL（哪怕加时间戳）更安全。