HTML页面上的GIF图片无法显示

Question

我有一个HTML页面，当它在等待服务器数据时，应该显示一个动画gif图像来表示正在等待。

以下是代码：

 $("#display").append('<img src="/templates/image.gif alt="red" width="30" height="30" " />');

以下是 HTML 代码：

 <div style="margin:0 auto;" id="display"></div>

动态gif图是从gif生成器http://www.ajaxload.info/获取并放置在相应的目录中。但是在Google Chrome中，只显示了一个“损坏的图片图标”，而在Firefox中根本没有显示任何内容。似乎无法访问.gif文件，因为当我尝试从服务器访问文件时，出现了404错误。即使我可以在工作区的目录中看到它。我无法确定问题可能是什么。谢谢。

- user1869421

Answer 1

火狐浏览器会隐藏“损坏的图片”，而Chrome/IE则会显示一个损坏的图像占位符。

看起来你没有关闭src属性。

$("#display").append('<img src="/templates/image.gif alt="red" width="30" height="30" " />');

应该是这样的

$("#display").append('<img src="/templates/image.gif" alt="red" width="30" height="30" />');

- Gilly

---

谢谢...但那不是问题所在。看起来好像无法找到文件，因为我收到了404错误。但我可以在我的工作区正确的目录中看到该文件。 - user1869421

哦，那就只是一个“尝试”目录的问题了。你可以使用“../”来进入上一级目录。你的工作空间是什么样子的？ - Gilly

你可以将完整的URL放入一个变量中，例如： var siteurl = 'http://www.google.nl'; 然后在img src中使用它： $("#display").append('<img src="' + siteurl + '/templates/image.gif" alt="red" width="30" height="30" />'); 这样，你就知道图片的确切位置了。 - Gilly

我尝试过了，仍然是同样的错误。但是当我尝试从浏览器访问文件时，gif图像显示正常！ - user1869421

啊，很高兴你解决了问题，没问题 :) - Gilly