日期:2014-05-16 浏览次数:20398 次
js 用户自定义多文件上传代码 <!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 type="text/javascript"> var attachname = "attach"; var i=1; function addInput(){ if(i<10){ var attach = attachname + i ; if(createInput(attach)) i=i+1; } } function deleteInput(){ if(i>1){ i=i-1; if(!removeInput()) i=i+1; } } function createInput(nm){ var aElement=document.createElement("div"); var html = "附件("+i+")<input type="file" id="FileUpload" + i + "" name="FileUpload" + i + "" title="选择图片" size="45" onchange="javascript:showphoto();"><br />" + "<img alt="js 用户自定义多文件上传代码" width="0" id="Image" + i + "" name="Image" + i + "" src="" title="图片预览" style="margin-left: 55px;" >"; aElement.innerHTML=html; //aElement.value="thanks"; //aElement.onclick=Function("asdf()"); if(document.getElementById("upload").appendChild(aElement) == null) return false; return true; } function removeInput(nm){ var aElement = document.getElementById("upload"); if(aElement.removeChild(aElement.lastChild) == null) return false; return true; } function showphoto(){ var re=/.(jpg|jpeg|JPG|JPEG)$/; var x=document.getElementById('upload').getElementsByTagName('input'); for(r=0;r<x.length;r++){ if ((!re.test(document.getElementById("FileUpload"+[r+1]).value)) & (document.getElementById("FileUpload"+[r+1]).value!="")) { alert("只允许上传jpg文件!"); document.getElementById("FileUpload"+[r+1]).outerHTML=document.getElementById("FileUpload"+[r+1]).outerHTML.replace(/value=w/g,''); document.getElementById("Image"+[r+1]).style.width="0px"; document.getElementById("Image"+[r+1]).src=""; }else if (document.getElementById("FileUpload"+[r+1]).value!="") { document.getElementById("Image"+[r+1]).style.width="100px"; document.getElementById("Image"+[r+1]).src=document.getElementById("FileUpload"+[r+1]).value; } } } function newInput(){ var x=document.getElementById('upload').getElementsByTagName('img'); for(r=0;r<9;r++){ addInput(); x[r].width="100"; x[r].src=document.getElementById("smPicture").value.replace("sm","sm"+[r+1]); //x[r].onerror=function(){deleteInput()}; } } </script> <script type="text/javascript"> onload=function(){ newInput(); } </script> </head> <body> <input type="button" name="button" value="添加附件" onclick="addInput()"> <input type="button" name="button" value="删除附件" onclick="deleteInput()"> <span id="upload"></span> <input name="smPicture" type="hidden" id="smPicture" value='http://222.70.206.26/img/5/5000011_sm.jpg'> </body> </html>
------解决方案--------------------
通过 form 标签,或者 flash
------解决方案--------------------
网上很多的,很容易的,根据你用的服务器端语言下个相应的版本就行了的
------解决方案--------------------