当前位置: 代码迷 >> Web前端 >> 无刷新下传文件
  详细解决方案

无刷新下传文件

热度:317   发布时间:2012-11-04 10:42:42.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> 
  相关解决方案