DOM 显示图像已加载，但页面未显示图像答案

【问题标题】：DOM shows that image has loaded, but page does not show imageDOM 显示图像已加载，但页面未显示图像
【发布时间】：2013-04-02 18:46:56
【问题描述】：

我在从表单提交后加载图像，这是我的代码：

$('#new_student').submit(function(event) {
    var spinner = '<%= image_tag("admin/loading.gif") %>';
    $('#register_student').replaceWith(spinner);
});

这是 Rails 3.2 资产管道的一部分。按钮已正确替换为图像，并且 DOM 正确显示了图像的路径，但页面仅显示了缺少的图像符号。关于为什么会发生这种情况的任何想法？

编辑

当我检查按钮时，它会正确替换，我可以单击图像路径并查看图像，因此显然路径是正确的。问题是，它不会显示在页面本身上。

【问题讨论】：

因为图片实际上丢失了？
试试 image_tag("loading.gif")
图片标签在一个叫admin的文件夹里，所以路径是admin/loading.gif。我可以将图像移动到根目录，同样的事情也会发生。当我检查它并且它是正确的图像时，我可以点击它被替换的图像，但它没有显示在页面上。
register_student 是否设置为可见？
您将按钮替换为 img 元素；我手动进行了替换，并在加载动画 gif 之前将损坏的图像显示了几秒钟。也许图像尚未加载，因此在页面重新加载之前无法显示？我可能会尝试在页面上加载图像但使其不可见，然后使用 replaceWith() 将按钮替换为（完全加载的）img 元素。值得一试。

标签： jquery ruby-on-rails asset-pipeline

【解决方案1】：

当单击按钮并将按钮元素替换为图像时，页面会显示“缺少图像”符号，直到图像完全加载。与其在单击按钮后加载图像，不如将其设置为页面其他位置的不可见元素。现在，当单击按钮时，图像已经加载。

【讨论】：

【解决方案2】：

你是不是在某个地方设置了错误的 z-index，所以图像是不可见的？？

【讨论】：

不行，我可以看到图片路径（我用的是chrome，所以显示为山图）
更好的是，它正在运行（只需点击注册，无需填写任何内容）：worldbibleschool.org/register