如何將文件追加到文件輸入字段

-1

我正在嘗試創建file drag and drop功能。如何將文件追加到文件輸入字段

我已經從div中拖放工作並處理文件。

現在我想將此文件追加到表格的Input[type=file]。

我該怎麼做？

我試過uploadFormData.append("files[]",f);和派生，但它不工作。我的調試是提交表單並檢查標題以查看文件是否已發送。

任何人都可以指出我在正確的方向如何實現這一目標？

<form enctype="multipart/form-data" id="yourregularuploadformId"> 
     <input type="file" name="files[]" multiple="multiple"> 
    </form> 

<script> 
     var uploadFormData = new FormData(jQuery("#yourregularuploadformId")[0]); 

     function handleFileSelect(evt) { 
     evt.stopPropagation(); 
     evt.preventDefault(); 

     var files = evt.dataTransfer.files; // FileList object. 

     // files is a FileList of File objects. List some properties. 

     var output = []; 


     for (var i = 0, f; f = files[i]; i++) { 
      output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ', 
         f.size, ' bytes, last modified: ', 
         f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a', 
         '</li>'); 
       uploadFormData.append("files[]",f); 
     } 

     document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>'; 
     } 
</script>

來源

2013-06-12 Jonathan Thurft

你想靜靜地添加一個文件到輸入文件沒有任何用戶交互，是你想要的？ –

我想從一個拖放div中添加文件 –

好的，所以用戶在一個div中拖動一個文件，並且想要在輸入文件[]中添加這個文件？如果是，爲什麼不讓用戶直接將文件拖到輸入文件？ –

恐怕你不能做這種方式，因爲你不能動態地填補<input type="file" ....>只是因爲如果這是允許的，意味着你可以抓住從用戶的計算機上的任何文件，而無需任何驗證。

你可以嘗試做的事情是在你的div上綁定一個像.change()這樣的事件，當文件被拖動時觸發，然後在該綁定上做一個ajax調用來上傳文件，最後得到文件名你想要什麼時候上傳完成）從ajax回調和按你想要的方式處理它

來源

2013-06-12 11:07:56 Jaay

如何將文件追加到文件輸入字段

回答

相關問題