在 Web 开发中，我们经常会遇到由于链接断开或服务器错误而导致图片加载失败的情况。 img 元素的 onerror 属性允许我们通过指定要显示的替代图像来处理这种情况。然而，用户报告其功能在不同浏览器中不一致，特别是在 Chrome 和 Mozilla 中。
为了说明该问题，让我们考虑以下代码片段：
<code class="html"><img src="invalid_image.jpg" onerror="this.src='alternate_image.jpg';"></code>
此代码尝试从无效来源加载图像。如果图像加载失败，则应触发 onerror 处理程序，用指定的备用图像替换损坏的图像。然而，用户发现这种方法在 Internet Explorer 以外的浏览器中不起作用。
这种行为的根本原因是浏览器对 onerror 事件的处理方式不同。如果备用图像加载失败，某些浏览器（例如 Chrome 和 Mozilla）将多次触发该事件，从而导致无限循环。为了防止这种情况，我们需要在第一次尝试后使用以下修改后的代码使 onerror 处理程序无效：
<code class="html"><img src="invalid_image.jpg" onerror="this.onerror=null;this.src='alternate_image.jpg';"></code>
通过使 onerror 处理程序无效，我们确保事件只会触发一次，从而防止无限循环。此方法在多种浏览器中一致有效，包括 Chrome、Mozilla 和 Internet Explorer。
以上是为什么图像的'onerror”属性在 Chrome 和 Mozilla 中表现不同？的详细内容。更多信息请关注PHP中文网其他相关文章！
