jQuery load（）不显示图像

Question

大家晚上好，

我正在使用JavaScript将HTML文件中的内容加载/覆盖到指定的div中 你可以watch a demo。

执行加载作业的javascript如下所示：

function loadScreenie(elementSelector, sourceURL) {
    $(""+elementSelector+"").load("img/screenies/"+sourceURL+"");
}

并通过如下所示的超链接调用：

<a href="javascript:loadScreenie('#iphone-screen', 'screenie2.htm');">mibmib</a>

（我也尝试过onclick =“”）

这是screenie2.htm

的内容

hello world<br />
<img src="screenie2.png" />

问题是图像不会显示。行为如下：
- 单击链接并执行javascript - screenie2.htm中的文本正确显示在正确的div中 - 图像不显示。也没有任何破碎的图像符号或空白空间。

您知道可能导致此错误的原因吗？

提前多多谢谢，
- 本尼

Answer 1

确定。让我总结一下你在这里发生了什么。

1. 点击链接后，jQuery会加载“img / screenies / screenie2.htm
2. 图片标记<img src="screenie2.png" />已插入DOM。

所以，我们有一个图像链接到 ./ screenie2.png 上的假想图像，你会认为它应该链接到* ./ ** img / screenies / ** screenie2。 PNG *

您需要在load()：ed内容中使用绝对网址。

Answer 2

如果您正在使用IE进行测试，问题可能是Jquery使用innerHTML而不是使用load命令创建单独的dom元素。 IE可能非常挑剔。