求助：JS 无法显示图片

ellendong 2011-05-20 09:38:56

本人菜鸟一只
想在javasript中显示图片

function drawTrend(){

	var rootDiv = document.getElementById('blank_lex'); //获取要加入文本的div

	rootDiv.innerHTML="<img src='trendPic.jpg'>";

}

但是无论把图片放在什么目录下，就是显示不了。
chrome调试JSP显示的错误为：
http://localhost:8080/MyProject/trendPic.jpg 404 (/MyProject/trendPic.jpg)
但是，我用浏览器直接输入这个地址，却可以正常显示图片～～
求解！

...全文

883 28 打赏收藏转发到动态举报

写回复

用AI写文章

28 条回复

切换为时间正序

请发表友善的回复…

发表回复

striverpan 2012-03-22

打赏
举报

是不是jsp 跳转才出现的？

ssd189 2011-05-25

打赏
举报

copy and paste

孟子E章 2011-05-25

打赏
举报

这个可能是你服务器设置或者网络的问题。

hezhejing621 2011-05-25

打赏
举报

function drawTrend(){
var rootDiv = document.getElementById('blank_lex'); //获取要加入文本的div
rootDiv.src="trendPic.jpg";
}

mengnanleo 2011-05-25

打赏
举报

上面错了。。是先在输出图片的同时隐藏，然后异步显示就能正常显示这个图片的
大意了下

mengnanleo 2011-05-24

打赏
举报

这个是图片预加载的问题，我在IE中遇到过，你试试异步，我就是这样实现的

setTimeout(function(){
var rootDiv = document.getElementById('blank_lex');
rootDiv.innerHTML="<img src='trendPic.jpg'>";
},50)

ellendong 2011-05-23

打赏
举报

这样显示不了图片
用了net-lover的方法是可以显示图片了
但是显示的不是最新生成的图片，而是之前的图片，而右键点击open image in new tab才会显示我新生成的图片，很奇怪。
如何解决呢[Quote=引用 18 楼 ddwren 的回复:]

没明白干嘛在文本对象层输出下边这个你可以试试
function drawTrend(){
var rootDiv = document.getElementById('blank_lex'); //获取要加入文本的div
rootDiv.style.background = "trendPic.jpg";
}
[/Quote]

ddwren 2011-05-23

打赏
举报

没明白干嘛在文本对象层输出下边这个你可以试试
function drawTrend(){
var rootDiv = document.getElementById('blank_lex'); //获取要加入文本的div
rootDiv.style.background = "trendPic.jpg";
}

ellendong 2011-05-23

打赏
举报

显示的是过去的图片，而右键点击open image in new tab才会显示我新生成的图片，为什么会这样呢？？太奇怪了[Quote=引用 15 楼 net_lover 的回复:]

我的意思是在html先放着一个<img id=x js 只设置src属性
[/Quote]

ellendong 2011-05-23

打赏
举报

非常感谢，终于可以显示图片了
不过显示的不是我实时新生成的图片，而是旧图片
开头加的那三句话，不能实现情况缓存吗？
[Quote=引用 15 楼 net_lover 的回复:]

我的意思是在html先放着一个<img id=x js 只设置src属性
[/Quote]

孟子E章 2011-05-23

打赏
举报

我的意思是在html先放着一个<img id=x js 只设置src属性

ellendong 2011-05-23

打赏
举报

to net_lover，我把图片改成了png格式

ellendong 2011-05-23

打赏
举报

是这样吗？可是什么图片都不显示了～连“叉图”也没有了

function drawTrend(){

	var rootDiv = document.getElementById('blank_lex'); //获取要加入文本的div

	rootDiv.innerHTML="<img id=x>";

	document.getElementById('x').src='trendPic.png'>;

}

[Quote=引用 12 楼 net_lover 的回复:]

那你就试试<img id=x

document.getElementById('x').src='xxx.jpg'
[/Quote]

孟子E章 2011-05-23

打赏
举报

那你就试试<img id=x

document.getElementById('x').src='xxx.jpg'

ellendong 2011-05-23

打赏
举报

非常感谢～
现在又出现了一个很奇怪的问题，因为我是把显示图片写在一个function中，作为button的响应，直接点button，显示不了，但是如果我右键点击open image in new tab，在另一个网页中正常显示后，再点button就可以正常显示。但是我已经添加了清空缓存的代码
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="0">
这是什么原因呢？
（我想实现的功能是，点击button，根据用户的输入作图，然后显示该图片；如果用户再次输入，再点击button，需要重新作图，然后显示新的图片）
[Quote=引用 10 楼 net_lover 的回复:]

如果没有特殊的设置，如防盗链
一个原因就是jpg的格式问题，你可以在Photoshop里面打开，看看模式是不是设置成 CMYK 格式了，这个一定要设置成RGB格式。

另外一个测试的方法，你可以换一个别的图片进行测试，如下载个sina网站的图片进行测试
[/Quote]

孟子E章 2011-05-23