javascript - Bootstrap - 出现图像加载错误时回退

Question

我想在无法加载原始图像时显示一个无图像占位符。
如果无法加载原始图像，我已经看到使用 JavaScript 的 this.error 设置备用图像。

是否有任何替代的清洁选项，可能是在 Bootstrap 中或使用 CSS3？

更新:这不适用于包含单个图像的页面。将有多个不同大小的图像。类似于社交媒体网站。所以修复的性能也很重要。此外，图像由不同的用户上传并存储在 Amazon S3 存储桶中。

Answer 1

没有JavaScript的解决方案:

<object data="path/to/your/placeholder.jpg" type="image/jpg">
    <img src="path/to/your/image.jpg">
</object>

但这是一个真正丑陋的。所以我会选择 JavaScript 而不是这个。