有关图片上传的问题

不知道是不是这样
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script language="javascript" type="text/javascript" >

</script>
</head><body>
<img id="img" src="" height="166" width="312" /><br />
<input type="file" name="files" onchange="haha();" />
</body>
</html>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="LiuYX">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD><BODY>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
<IMG ID="preview" SRC="C:/Documents and Settings/Andy1/My Documents/My Pictures/样品.jpg" WIDTH="283" HEIGHT="212" BORDER="0" ALT=""><input type="file" id="uploadImg" onpropertychange ="setImg(this);" />
</BODY>
</HTML>
楼上的代码一点都不简洁，象<meta> 之类的直接省掉嘛,跟问题又没关系.
我的意见是用onmousedown事件,通过选中图片来触发它,链接到图片.<head>
<script language="javascript">
function fn()
{
preview.src=pic.value;
}
function haha(){
img.src=files.value;
}</script>
</head>
<body onmousedown="fn()">
<img id="preview" src="#" height="166" width="312" /><br />
<input type="file" name="pic"  onchange="haha()"  /></body>
有点错误,应该让pic和files指向不同或相同的图片,少了一段代码.
准备三张图片在这同一文件目录下，名字自己取//changePic(picSRC)<script language="javascript" type="text/javascript">

function changePic(picSRC)
{
var container = document.getElementById("container");
var imgSrc = "./image/"+picSRC;
container.setAttribute("src",imgSrc);
container.style.visibility = 'visible';
}
</script>
</HEAD><BODY>
<div onclick="changePic('image1.gif');">图片1</div><div onclick="changePic('image2.gif');">图片2</div><div onclick="changePic('image3.gif');">图片3</div>
<img id="container" src="" style="visibility:hidden;">
更正一下： var imgSrc = "./image/"+picSRC;改成  var imgSrc = "./"+picSRC; //同一目录
另一方面，你的图片怎么存，还是要去服务端取图片吧。
你可以用AJAX试试
谢谢大家,huantianxidi(欢天喜地) ,liuyxit(苦涩的咖啡),chszs(老刀)我就是要的这种效果,不过就是在没有上传图片前,那个显示图片的区域最好能隐藏起来
要不没上传图片时就会有一个红叉在那
这只是一个 css 的问题。
<img id="container" src="" style="visibility:hidden;">
就可以了。
<img id="container" src="" style="visibility:hidden;">
用了这个后,在开始是把那个隐藏起来了,可是最后选择的图片也显示不出来了
<html>
<head>
<script language="javascript">
function viewimage() {
document.form1.viewimg.src = document.form1.file1.value;
}
</script>
</head>
<body>
<form action="" name="form1">
预览图：<img id="viewimg">
上传域：<input type="file" name="file1" onchange="viewimage()" />
</form>
</body>
</html>
<html>
<head>
<script language="javascript">
function viewimage() {
document.getElementById("img").style.display = "block";
document.form1.viewimg.src = document.form1.file1.value;
}
</script>
</head>
<body>
<form action="" name="form1">
<div id="img" style="display:none">预览图：<img id="viewimg"></div>
<div>上传域：<input type="file" name="file1" onchange="viewimage()" /></div>
</form>
</body>
</html>
加入了，开始时隐藏，浏览图片后显示，请空文本框的内容后自动又隐藏。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Description" CONTENT="">
</HEAD><BODY>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
<IMG ID="preview" style="display:none" SRC="C:/Documents and Settings/Andy1/My Documents/My Pictures/样品.jpg" WIDTH="283" HEIGHT="212" BORDER="0" ALT=""><input type="file" id="uploadImg" onpropertychange ="setImg(this);" />
</BODY>
</HTML>