<!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>
function changePic(picno){
var pic = document.getElementById(picno);
document.getElementById("img").src = pic.value
}
</script>
</head><body>
<input type="file" size="30" id="pic1" /><input type="button" value="确定" onclick="changePic('pic1')" /><br />
<img src="http://bbs.blueidea.com/images/blue/logo.gif" id="img" border=1 />
</body>
</html>
大致的思路就是这样。
有时候按下确定之后，img不能取得input中value值，导致图片不显示。
无论怎么按确定都是不显示。这种情况发生的几率很低，但的确是遇到了几次。一直都不知道什么原因。
请问一下有没有哪位遇到过这种问题，应该怎么解决呢？？谢谢
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script>
function changePic(picno){
var pic = document.getElementById(picno);
document.getElementById("img").src = pic.value
}
</script>
</head><body>
<input type="file" size="30" id="pic1" /><input type="button" value="确定" onclick="changePic('pic1')" /><br />
<img src="http://bbs.blueidea.com/images/blue/logo.gif" id="img" border=1 />
</body>
</html>
大致的思路就是这样。
有时候按下确定之后，img不能取得input中value值，导致图片不显示。
无论怎么按确定都是不显示。这种情况发生的几率很低，但的确是遇到了几次。一直都不知道什么原因。
请问一下有没有哪位遇到过这种问题，应该怎么解决呢？？谢谢
这个问题就是不明白到底是怎么发生的。如果有需要的话，我整理一下整个代码给大家参考参考吧。
这个问题的确是困扰了我蛮久的。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script>
var pictureno=1;
var ftiArray = new Array(0,1,2,3,4,5,6);
var addflag=0;
var emptyPicUrl = "html/inc/images/noimg.gif";
var filesizelimit = 1024;
function setPictureNo(picno){
pictureno=picno;
}
function changepic(picno){
//debugger;
var picname = document.getElementById("x_Photo"+ftiArray[picno]).value;
if(picname.length==0){
addflag=0
}else{
addflag=picno;
}
//checkFileSize(picname);
}
function addpic(picno){
//debugger;
var picname = document.getElementById("x_Photo"+ftiArray[picno]).value;
var imgtemp = new Image();
imgtemp.src = picname;
var imgFileSize = Math.round(imgtemp.fileSize/1024*100)/100;
if(imgFileSize>filesizelimit){
alert("您上传的图片大小必须小于1024K!\n当前图片大小为"+imgFileSize+"K。");
clearFileInput(document.getElementById("x_Photo"+ftiArray[picno]));
return;
}
if(picname.length==0){
alert("请先选择图片!");
return;
}
if(checkFileType(picname)==false){
alert("您上传的图片类型必须为.jpg,.gif类型!");
return;
} document.getElementById("carimg"+picno).src = "file:///" + picname.replace(/\\/ig,"/");
document.getElementById("carimgdiv"+ftiArray[picno]).style.display="none";
if(picno<=5)document.getElementById("carimgdiv"+ftiArray[picno+1]).style.display="block";
pictureno=picno+1;
addflag=0;
}function checkflag(){
document.getElementById("ordervalue").value=ftiArray[1]+","+ftiArray[2]+","+ftiArray[3]+","+ftiArray[4]+","+ftiArray[5];
if(addflag>0){
var divtoempty="请选择图片：<input name=\"x_Photo"+ftiArray[pictureno]+"\" id=\"x_Photo"+ftiArray[pictureno]+"\" style=\"width:250px\" type=\"file\" onpropertychange=\"changepic("+pictureno+");\"/> <input type=\"button\" value=\"确定\" onclick=\"addpic("+pictureno+")\"/>";
document.getElementById("carimgdiv"+ftiArray[pictureno]).innerHTML=divtoempty;
return false;
}else{
return true;
}
}
//清空文件上传框
function clearFileInput(file){
var form=document.createElement('form');
document.body.appendChild(form);
//记住file在旧表单中的的位置
var pos=file.nextSibling;
form.appendChild(file);
form.reset();
pos.parentNode.insertBefore(file,pos);
document.body.removeChild(form);
}
function checkFileType(str){
var pos = str.lastIndexOf(".");
var lastname = str.substring(pos,str.length);
if (lastname.toLowerCase()!=".jpg" && lastname.toLowerCase()!=".gif"){
return false;
}else{
return true;
}
}
function checkFileSize(filename){
var imgtemp = new Image();
imgtemp.src = filename;
if(imgtemp.fileSize>filesizelimit){
return 1;
}
if(imgtemp.fileSize<0){
return -1;
}else{
return 0;
}
}
</script>
<style>
li{float:left;width:120px;}
img{border:1px solid #ccc;width:100px;height:75px;}
</style>
</head>
<body>
<div class="sendImg">
<div id="carimgdiv1">请选择图片：
<input name="x_Photo1" id="x_Photo1" style="width:250px" type="file" onpropertychange="changepic(1);" />
<input type="button" value="确定" onclick="addpic(1)"/>
</div>
<div id="carimgdiv2" style="display:none">请选择图片：
<input name="x_Photo2" id="x_Photo2" style="width:250px" type="file" onpropertychange="changepic(2);"/>
<input type="button" value="确定" onclick="addpic(2)"/>
</div>
<div id="carimgdiv3" style="display:none">请选择图片：
<input name="x_Photo3" id="x_Photo3" style="width:250px" type="file" onpropertychange="changepic(3);"/>
<input type="button" value="确定" onclick="addpic(3)"/>
</div>
<div id="carimgdiv4" style="display:none">请选择图片：
<input name="x_Photo4" id="x_Photo4" style="width:250px" type="file" onpropertychange="changepic(4);"/>
<input type="button" value="确定" onclick="addpic(4)"/>
</div>
<div id="carimgdiv5" style="display:none">请选择图片：
<input name="x_Photo5" id="x_Photo5" style="width:250px" type="file" onpropertychange="changepic(5);"/>
<input type="button" value="确定" onclick="addpic(5)"/>
</div>
<div id="carimgdiv6" style="display:none" class="cRed">您已经选择了五张图片，如果需要更换，请先删除下面其中一张图片。</div>
</div>
<div class="imgBox">
<ul class="wrapfix">
<li>
<div><img id="carimg1" src="html/inc/images/noimg.gif" /></div>
</li>
<li>
<div><img id="carimg2" src="html/inc/images/noimg.gif" /></div>
</li>
<li>
<div><img id="carimg3" src="html/inc/images/noimg.gif" /></div>
</li>
<li>
<div><img id="carimg4" src="html/inc/images/noimg.gif" /></div>
</li>
<li>
<div><img id="carimg5" src="html/inc/images/noimg.gif" /></div>
</li>
</ul>
</div>
</body>
</html>我把代码发说呢过来看看大家有没有其他的修改建议吧。谢谢。
这个问题会发生的几率很少很少，但的确是曾经遇到了。
我需要的效果就是支持ie6就行了。
现在的问题非兼容。