通過ajax將文件上傳到php

我的表單使用javascript警報與用戶進行通信，因爲這是我工作的公司中的首選方法（而不是不斷的重定向到和來自php處理文件）。通過ajax將文件上傳到php

因此，我通過jQuery中的一些簡單驗證來傳遞所有表單數據，並通過ajax將其發送到php處理程序。這是一個基本看我怎麼做......

var first_name = $(sender + ' #first_name'); 
var email = $(sender + ' #email'); 
var tel = $(sender + ' #telephone'); 
var comments = $(sender + ' #comments'); 

$.ajax({ 
    type: 'POST', 
    url: 'sendmail.php', 
    data: { first_name: first_name.val(), 
     email: email.val(), 
     telephone: tel.val(), 
     comments: comments.val(), 
     success: function clearFields() { 
      first_name.val(''); 
      email.val(''); 
      tel.val(''); 
      comments.val(''); 
      alert('Thank you. We will contact you as soon as possible.'); 
     } 
    } 
});

如下與上傳，我無法具有所添加的文件輸入字段來一個這樣的形式。雖然郵件正確地發送，我不認爲Ajax是發送到PHP文件

<input type="file" name="upload" id="upload" /> 

<script> 

var upload = $("#upload"); 
$.ajax({ 
    type: 'POST', 
    url: 'sendmail.php', 
    data: { first_name: first_name.val(), 
     email: email.val(), 
     telephone: tel.val(), 
     upload: upload.val(), 
     comments: comments.val(), 
     success: function clearFields() { 
      first_name.val(''); 
      email.val(''); 
      tel.val(''); 
      upload.val(''); 
      comments.val(''); 
      alert('Thank you. We will contact you as soon as possible.'); 
     } 
    } 
}); 
</script>

我發現了許多用於此選項上傳任何可用的數據，但所有那些我」我看着such as this對我來說似乎是「黑客」。

有沒有更簡單的方法來做到這一點？

來源

2013-02-27 Ortund

是不是要使用jQuery Form？ http://malsup.com/jquery/form/ – alexbusu 2013-02-27 08:40:08

你必須通過iframe來做到這一點

所以你創建一個隱藏的iframe

<iframe id="upload_target" name="upload_target" style="display: none;" src="#"></iframe> 
<!-- note the src="#" -->

然後創建了一些按鈕的形式和您希望

<form action="path/to/uploadscript.php" method="POST" enctype="multipart/form-data" target="upload_target"> 
<!--target will tell the browser to run it in the iFrame with name="upload_target" -->

所有領域

然後在uploadscript.php中，您可以使用所有表單值，就好像它們是常規的$ _POST值：

<?php upload_file($_FILES['file'], $_POST['name'], $_POST['whatever']); ?>

這和使用AJAX幾乎一樣。

來源

2013-02-27 08:45:56 AmazingDreams

我在這個問題中鏈接的頁面確實涉及到做同樣的事情，但它涉及到很多，這就是爲什麼它看起來非常像一個黑客...所以在哪裏這去我的PHP文件，建立電子郵件？ – Ortund 2013-02-27 09:01:39

我正確地假設我只是將'upload_target'傳遞給sendmail.php文件？ – Ortund 2013-02-27 09:06:48

@Ortund將表單動作設置爲您的sendmail.php文件，然後它應該是很好的去。你可以添加任何你想要的形式，它的行爲就像普通的POST。我使用它來上傳圖片，檢查我是否支持文件類型（如果不是我給JS警報;）），否則將其插入到數據庫中。與所有的領域。所以我想你可以用它來發送郵件:) – AmazingDreams 2013-02-27 10:02:11

Ajax不支持file上傳操作。但是有很多插件使用iframe來異步上傳文件。你可以閱讀更多關於這種技術here。

支持形式上傳幾個jQuery插件是
1. jQuery form
2. jQuery-File-Upload

在許多Q & A位點有這方面很多問題的答案，像this one。

使用HTML5的另一個解決方案是使用FormData討論here。

來源

2013-02-27 08:39:28

通過ajax將文件上傳到php

回答

相關問題