javascript - 如何从类中加载默认图像

我在使用时在 .hbs 文件中设置了默认图像

<img src="{{source_image_number}}.png" alt={{source_image_number}} onerror="default_image.png">.

,expexing当加载源图像出现问题时，可以加载默认图像，而不是有一点破损的图像标志（特别是对于Chrome）。现在我使用来自第三方类的另一个图像作为默认图像。就像下面的css文件：

.icon-default: { content: '\e050'; transform: translate(2px, 3.5px); }

我尝试了三种解决方案：

创建一个<div class="default-image">包含必要信息的类。然后使用onerror="this.display='none'"and 之后调用 class default-image。这个解决方案的问题是，当{{source_image_number}}.png正确加载时，默认图像也会被加载。
在 .js 文件中使用 jquery 来处理 onerror 情况。但是当 jquery 检测到源图像的问题并读取默认图像时，页面已经完全加载。结果，同时存在小破碎图像标志和默认图像。
在加载页面之前使用jquery检查源图像是否存在。它以在客户端出现未经过身份验证的读取文件问题结束（错误消息不完全是这个，但在多次出现空错误后，我想是因为这个）。

我想到但未测试的第 4 个解决方案是使用代理进行身份验证，然后按照第 3 个解决方案中所述进行检查，但我犹豫是否有更简单的方法来执行此操作。

我应该怎么做才能将此图像设为默认值？

标签： javascripthtmlcssimagehandlebars.js