当前位置: 代码迷 >> Web前端 >> 无刷新上传资料
  详细解决方案

无刷新上传资料

热度:45   发布时间:2013-03-26 09:54:33.0
无刷新上传文件

兼容主流浏览器

<!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="">  
 <META NAME="Keywords" CONTENT="">  
 <META NAME="Description" CONTENT="">  
 <script type="text/javascript">  
  
 /*附件添加提示*/   
  function getFirefoxTip(form)   
  {   
               var tipDiv=document.createElement("div");   
               tipDiv.style.cssText="width:100px;font:12px Arial;color:#00f;text-decoration:underline";   
               tipDiv.innerHTML="添加一个附件";   
               tipDiv.onclick=function()   
               {   
                       var i=form.getAttribute("count")||0;   
                       createInput(form,parseInt(i)+1);   
               };   
			   form.appendChild(tipDiv);
  }   
  
 /*删除已经添加的附件项*/   
  function removeChild(parent,child)   
  {   
  var i=parent.getAttribute("count");   
  parent.removeChild(child);   
  i--;   
  if(i==0)   
    {   
      parent.lastChild.innerHTML="添加一个附件";   
    }   
  parent.setAttribute("count",i);   
  }   
  
  /* 添加移除项*/   
  function getRemove(form,node)   
  {   
               var span=document.createElement("span");   
               span.style.cssText="font:10px Arial;color:#00f;text-decoration:underline;";   
	           span.innerHTML="移除";   
               span.onclick=function(){removeChild(form,node);}   
               return span;   
  }   
  
  /*文件选择框*/   
  function createInput(form,inputIndex)   
  {   
               var i=inputIndex||0;   
               if(i==0)   
               {   
                       getFirefoxTip(form);;   
               }   
               else   
               {          
                       var inputDiv=document.createElement("div");   
                       var input=document.createElement("input");   
                       input.setAttribute("type","file");   
                       input.setAttribute("name","file_"+i);   
                       inputDiv.appendChild(input);   
                       inputDiv.appendChild(getRemove(form,inputDiv));   
                       form.insertBefore(inputDiv,form.lastChild);   
                       form.setAttribute("count",i);   
                       form.lastChild.innerHTML="再添加一个附件";   
               }   
                  
       }   
  /*初始化*/   
  function init()   
  {   
       createInput(document.forms['uploadForm']);   
  }   
 </script>  
</HEAD>  
  
<BODY onload="init()">  
<form name="uploadForm" action="/upload.do" target="upload" enctype="multipart/form-data" method="post"></form>  
<iframe name="upload" style="display:none"></iframe>  
</BODY></HTML>
?

?

?

  相关解决方案