当我使用Javascript innerHTML调用它时，为什么我的图像不显示？

我对Javascript很新颖，我正在尝试一些东西。我正在使用一个函数来使用innerHTML在表格中加载图像。但是图像不会显示出来，除非我在函数底部调用alert（“whatever”），然后在警报可见时显示。我使用的代码是一样的东西（的功能从外部的js文件名为）当我使用Javascript innerHTML调用它时，为什么我的图像不显示？

<script> 
    function show(){ 
     document.getElementById('imageHolder1').innerHTML="<a href="#"><img='photos/picture.jpg' border=0/></a>"; 
    } 
</script> 

<body> <input name="b1" type="button" value="pics" onclick="show()"/> 
<table><td id='imageHolder1'>picture</td></table> 
</body> ``

我不明白为什么它不工作，我已经看过类似的所有例子中，我看到没有什么大的区别。即使我试着用标签它不起作用。欢迎任何帮助！在此先感谢，如果你有任何关于如何做到这一点的建议（因为我还在学习javascript，所以没有jquery），我也很感激。再次感谢！

来源

2012-03-01 biobio

检查＃，你需要逃避“在你的innerHTML字符串innerHTML是一个可以使用的野兽，因为你必须确保你所插入的每一个东西都是真实的，很好的HTML。可能想看看更加详细但更值得信赖的DOM操作javascript，比如'appendChild'等。 – user17753 2012-03-01 21:38:50

另外，我建议你使用像FF或其他JavaScript调试器一样的萤火虫，因为这些错误更容易发现。 – user17753 2012-03-01 21:41:13

谢谢，我会尝试appendChild，并明确地看看Javascript调试器，因为这个例子似乎没有任何作用因为它是这样的 – biobio 2012-03-01 22:40:03

您在字符串中有一个错误：

document.getElementById('imageHolder1').innerHTML="<a href="#"><img='photos/picture.jpg' border=0/></a>";

应改为

document.getElementById('imageHolder1').innerHTML="<a href='#'><img src='photos/picture.jpg' border=0/></a>";

（通知“，”更换）

来源

2012-03-01 21:35:57

这必须是一个坏的n-paste，否则它会产生一个Synt axError – 2012-03-01 21:40:13

是真的，我粘贴 – biobio 2012-03-01 22:49:30

您不添加图像src和它。应该是href='#'它应该是这样的

function show(){ 
    document.getElementById('imageHolder1').innerHTML="<a href='#'><img src='photos/picture.jpg' border='0'/></a>"; 
}

来源

2012-03-01 21:36:43 clem

先给图像的“形象”的ID，然后在使用下列内容：

function show(){ 
    document.getElementById('image').src = 'photos/picture.jpg' 
}

来源

2012-03-01 21:38:06 Jack

谢谢删除了src！有用。 – biobio 2012-03-01 22:38:37

很高兴有帮助。 – Jack 2012-03-01 22:39:16

有代码中的错误和懒惰的捷径地段。我做了一个小提琴，不得不纠正很多地方，看起来很匆忙的工作...这里是你的小提琴，但玩一些奉献：http://jsfiddle.net/uXpeK/

来源

2012-03-01 21:41:58 mindandmedia

非常感谢您花时间做到这一点！我想这与放置重要属性有关。 – biobio 2012-03-01 22:46:44

当我使用Javascript innerHTML调用它时，为什么我的图像不显示？

回答

相关问题