小編給大家分享一下js如何實(shí)現(xiàn)動(dòng)態(tài)添加上傳文件頁(yè)面，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)公司-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價(jià)比如東網(wǎng)站開(kāi)發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫(kù),直接使用。一站式如東網(wǎng)站制作公司更省心,省錢(qián),快速模板網(wǎng)站建設(shè)找我們，業(yè)務(wù)覆蓋如東地區(qū)。費(fèi)用合理售后完善，10年實(shí)體公司更值得信賴。JS是什么

JS是JavaScript的簡(jiǎn)稱，它是一種直譯式的腳本語(yǔ)言，其解釋器被稱為JavaScript引擎，是瀏覽器的一部分，主要用于web的開(kāi)發(fā)，可以給網(wǎng)站添加各種各樣的動(dòng)態(tài)效果，讓網(wǎng)頁(yè)更加美觀。

發(fā)郵件是需要添加一些文件，每添加一個(gè)文件，頁(yè)面上可以顯示一個(gè)表單文件上傳選項(xiàng)。

此功能為：初始時(shí)刻只有一個(gè)添加按鈕，當(dāng)點(diǎn)擊添加文件時(shí)，會(huì)增加一個(gè)選擇文件和刪除區(qū)域，同時(shí)顯示上傳按鈕，當(dāng)點(diǎn)擊刪除，此行選擇文件行消失，當(dāng)所有選擇文件項(xiàng)都消失時(shí)，上傳按鈕將被隱藏起來(lái)。下面是實(shí)例代碼：

 
 
 
 
  var num=0;
  function addFile(event){
  //創(chuàng)建一個(gè)div標(biāo)簽，用以包含一個(gè)input標(biāo)簽和刪除按鈕
  var innerdiv = document.createElement("div");
  
  //創(chuàng)建一個(gè)input標(biāo)簽
  var inputNode = document.createElement("input");
  inputNode.name = "fileName";
  inputNode.type="file";
  
  //創(chuàng)建一個(gè)刪除按鈕
  var delNode = document.createElement("input");
  delNode.name = "del";
  delNode.type = "button";
  delNode.value="刪除";
  
  var submit = document.getElementById("submit");
  
  //刪除當(dāng)前刪除按鈕所在的標(biāo)簽,為此按鈕點(diǎn)擊事件創(chuàng)建一個(gè)處理函數(shù)
  delNode.onclick = function d(){
  this.parentNode.parentNode.removeChild(this.parentNode); //刪除此div區(qū)域
  var fileNodes = document.getElementsByName("fileName");
  //當(dāng)沒(méi)有上傳文件時(shí)，隱藏submit按鈕
  if(fileNodes.length==0){
  submit.style.display="none";
  }
  };
  
  innerdiv.appendChild(inputNode);
  innerdiv.appendChild(delNode);
  
  var div = document.getElementById("file");
  div.appendChild(innerdiv);
  
  submit.style.display="block";
  
  }
 
 
 
 
 
 
  上傳文件: 
  
  
  
  
  
  
 
 

此實(shí)例代碼中，addFile將動(dòng)態(tài)增加一個(gè)div區(qū)域，div區(qū)域包含一個(gè)file input標(biāo)簽和刪除按鈕。

動(dòng)態(tài)創(chuàng)建一個(gè)input標(biāo)簽示例：

//創(chuàng)建一個(gè)div標(biāo)簽，用以包含一個(gè)input標(biāo)簽和刪除按鈕
 var innerdiv = document.createElement("div");
  
//創(chuàng)建一個(gè)input標(biāo)簽
 var inputNode = document.createElement("input");
 inputNode.name = "fileName";
 inputNode.type="file";
 innerdiv.appendChild(inputNode);

以上是“js如何實(shí)現(xiàn)動(dòng)態(tài)添加上傳文件頁(yè)面”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

網(wǎng)頁(yè)題目：js如何實(shí)現(xiàn)動(dòng)態(tài)添加上傳文件頁(yè)面-創(chuàng)新互聯(lián)
地址分享：http://weahome.cn/article/coeopg.html