javascript - 下载图像时如何删除显示的问号？

Question

当用户单击按钮时，图像被下载。

在下载它们时，Safari 会显示一个问号。

我怎样才能摆脱这个？

我考虑了 onerror 事件侦听器，但这不是错误。下载图像只需要时间。并不是图像不在指定的 src 中。

在 ajax 调用之后，图像标签被添加到页面的 dom 中。当图像元素等待访问实际图像时，它会显示这个烦人的问号。

我怎样才能摆脱它？

Answer 1

隐藏包装元素，直到图像完全加载。您可以将 onload 事件挂钩到图像，然后让它在完成时显示包装元素。

Answer 2

在显示之前预加载图像。

或者，在加载图像时，有一个作为占位符的微调器的图像。

或者，等待显示图像，直到它被加载。

Answer 3

您可以等待图像本身加载。在设置属性之前创建图像元素并添加onload回调。src在回调中，您可以将图像添加到 dom。

Answer 4

从您的 HTML 源代码中删除<img>-tags。将带有 Javascript 的图像作为Image()对象加载。将 onload 处理程序添加到图像。让这些加载图像创建<img>标签并将它们插入到 DOM 中。

Image image = new Image();
image.onload = function() {
     // insert image into your DOM 
}
image.src = 'yourImage.jpg';