如何使用jquery上傳文件？

Question

我想使用jQuery上傳文件並存儲在服務器上的文件夾中。我不知道如何開始。文件路徑也需要存儲在Oracle數據庫中。我的整個場景都基於實體框架。有沒有人有任何想法如何解決這個問題？

Answer 1

使用此插件進行jquery文件上傳。

http://www.uploadify.com/

或者使用下面的 -

http://blueimp.github.com/jQuery-File-Upload/

，或者在尋找一些更體面的插件 -

http://www.tutorialchip.com/jquery/9-powerful-jquery-file-upload-plugins/

Answer 2

您可以輕鬆地使用iframe的文件上傳在jQuery中，如果你不想使用任何插件。我已經解決了這個問題，從那以後我就面臨這個問題。

$(document).ready(function() { 
    $("#formsubmit").click(function() {  

     var iframe = $('<iframe name="postframe" id="postframe" class="hidden" src="about:none" />');   

     $('div#iframe').append(iframe);   

     $('#theuploadform').attr("action", "/ajax/user.asmx/Upload") 
     $('#theuploadform').attr("method", "post") 
     $('#theuploadform').attr("userfile", $('#userfile').val()) 
     $('#theuploadform').attr("enctype", "multipart/form-data") 
     $('#theuploadform').attr("encoding", "multipart/form-data") 
     $('#theuploadform').attr("target", "postframe")   
     $('#theuploadform').submit(); 
     //need to get contents of the iframe 
     $("#postframe").load(
      function() { 
       iframeContents = $("iframe")[0].contentDocument.body.innerHTML; 
       $("div#textarea").html(iframeContents); 
      } 
     ); 



<div id="uploadform"> 
    <form id="theuploadform" action=""> 
     <input id="userfile" name="userfile" size="50" type="file" /> 
     <input id="formsubmit" type="submit" value="Send File" /> 
    </form> 
</div> 

<div id="iframe" style="width: 0px; height: 0px; display: none;"> 
</div> 

<div id="textarea"> 
</div> 

它會上傳文件。現在唯一剩下的就是在服務器上接收該文件。我已經使用servlet獲取文件，之後我調用了一個服務。 這個例子將每個文件的圖像，文本，DOCX，DOC等工作

的Servlet：

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
try { 
    ServletFileUpload upload = new ServletFileUpload(); 
    response.setContentType("text/plain"); 
    //response.setContentType("application/msword"); 


    FileItemIterator iterator = upload.getItemIterator(request); 

    while (iterator.hasNext()) { 
     FileItemStream item = iterator.next(); 
     String filename = item.getName(); 
     InputStream stream = item.openStream(); 
     //more here you wanna to do with that file do. 
    } 
} 
catch (FileUploadException e) { 
    // TODO Auto-generated catch block 
    e.printStackTrace(); 
} 

享受...