如何使用jQuery發送文件輸入？

我有一個包含3個文件inputs.i想要通過jquery.i發送它的jQuery中的序列化函數，但我意識到這個功能不發送文件輸入！如何使用jQuery發送文件輸入？

這裏是我的形式：

<form id="submit_pics" action="#" > 

    file 1 : <input name="file1" id="file1" type="file" /><br /> 
    file 2 : <input name="file2" id="file2" type="file" /><br /> 
    file 3 : <input name="file3" id="file3" type="file" /><br /> 

    <br /> 
    <div> 
     <a id="submit" href="javascript:;" ><img src="uploads/images/button1.png" /></a> 
    </div> 

</form>

，這是我的javascript代碼：

<script type="text/javascript"> 

    $(document).ready(function(){ 

     $("#level3").click(function(event) { 

      var str = $("#submit_pics").serialize(); 
      $.ajax({ 
       type: "POST", 
       url: "track.php", 
       data: str, 
       success: function(theResponse) { 

             $('#req_result').html(theResponse); 

            } 

       return false; 
     }); 

    });

來源

2010-08-26 armin etemadi

不幸的是，你不能通過XMLHttpRequest上傳文件。 AJAX實際上並不會將表單發佈到服務器，它會以POST或GET請求的形式發送選定的數據。 Javascript無法從用戶機器抓取文件並將其發送到服務器

您可以使用棘手的解決方法，向隱藏的iframe發送請求（無AJAX）。

看一看這個TUTORIAL

來源

2010-08-26 09:02:30 dmarucco

非常感謝你的朋友爲你的完整答案，你已經幫助了我很多:) – 2010-08-28 08:20:56

這是真的嗎？這個博客另有說明：http://portfolio.planetjon.ca/2014/01/26/submit-file-input-via-ajax-jquery-easy-way/ – 2014-04-11 08:35:25

它曾經是真的，是的。現在大多數瀏覽器都是最新的並且允許這樣做。雖然，我相信IE仍然有一些保護功能，除非用戶手動點擊提交，否則不會發布。 – 2016-07-12 18:08:20

你應該看看JQuery Form Plugin。有了這個，你可以很容易地以編程方式提交你有任何形式。

來源

2010-08-26 07:43:51

你不能通過$.ajax()做到這一點，但你可以使用這個uploadify plugin。

來源

2010-08-26 07:44:00 Reigel

一些研究，我發現，你可以做到這一點後：

$.ajax({ 
    url: 'track.php', 
    type: 'POST', 
    data: new FormData($("#submit_pics")[0]), 
    processData: false, 
    contentType: false 
}).

我Java程序員（Liferay的），並在服務器我用這個得到的文件：

UploadPortletRequest uploadRequest = PortalUtil.getUploadPortletRequest(request); 
File File1 = uploadRequest.getFile("file1"); 
File File2 = uploadRequest.getFile("file2");

我supose類似的東西存在於PHP中。

來源

2015-03-25 15:08:19 Joan

如何使用jQuery發送文件輸入？

回答

相關問題