開始選擇文件後上傳

通常情況下，要上傳文件，需要兩步處理 - 選擇一個文件，然後確認上傳。我正在上傳個人資料照片。由於配置文件圖片通常很小，我希望通過在文件選擇時啓動文件上傳來減少我的用戶的鼠標點擊。請提出很好的，也許是常見的方法來實現這一目標（如果有的話，我也想知道他們的陷阱）。謝謝。開始選擇文件後上傳

來源

2011-08-19 tamakisquare

當從文件上傳字段中選擇文件時，change事件將觸發。如果未選擇文件（字段被清除），字段的值將是''。

<form method="post" action="upload.script"> 
    <input type="file" id="formfile"/> 
    <input type="submit" id="formsubmit"/> 
</form> 

<script type="text/javascript"> 
    var file= document.getElementById('formfile'); 
    var submit= document.getElementById('formsubmit'); 

    // If scripting is available, can auto-submit the form, so no submit 
    // button needed. 
    // 
    submit.parentNode.removeChild(submit); 

    // When field is filled in with a filename, submit form 
    // 
    file.onchange= function() { 
     if (this.value!=='') 
      this.form.submit(); 
    }; 
</script>

這是個好主意嗎？可疑的。如果用戶不期望自動提交表單可能會產生負面影響。

來源

2011-08-19 21:49:15 bobince

感謝您提供您的解決方案。至於你提到的問題，我認爲這不會引起我主要關心的問題。 – tamakisquare

對IE8的調用form.submit（）會失敗，並且訪問被拒絕。 –

@Maurice：？在IE6中對我很好。 – bobince

你可以使用jQuery自動發佈該文件以在選擇服務器...

問題：

如果哪些用戶不想要選擇該文件，但該文件已被上傳到服務器？

如果上一次發生在文件上傳完成之前該怎麼辦？

當用戶什麼都不做並關閉頁面時如何？您要保留文件多長時間

來源

2011-08-19 21:38:05 secretformula

如果您使用GMail，您會注意到它們具有用於將文件附加到電子郵件的拖放解決方案。從桌面拖動到預定義的區域和wallah。

如果您對使用此功能的人（如果他們保持最新狀態，最應該這樣做）支持HTML5，那麼您可以使用內置於HTML5的拖放功能。

嘗試尋找這個：http://www.thebuzzmedia.com/html5-drag-and-drop-and-file-api-tutorial/

你也可以給像Plupload一試（http://www.plupload.com/），但可能是矯枉過正這一點。 Plupload更適用於需要進度動畫和分塊的較大文件。但是，我知道你可以編寫腳本，以便立即開始上傳，並在完成後立即重定向。它也可能需要你沒有設置的服務器端工作。

來源

2011-08-19 21:41:53 Guttsy

開始選擇文件後上傳

回答

相關問題