電子郵件發送表單PHP無刷新（jQuery和阿賈克斯）

-2

我試圖在PHP和HTML a電子郵件形式，很多人都知道按下提交按鈕後，頁面重新加載，我想避免這種情況。我知道，你可以使用jQuery和AJAX爲此，我已經看到了很多問題＃1關於它給予修復，但我仍然不明白這一點作爲英語非母語的人，我想，如果人們解釋給我一個遠一點繼承人我的代碼：電子郵件發送表單PHP無刷新（jQuery和阿賈克斯）

HTML & AJAX（test.html中）

<!DOCTYPE html> 
<html lang="en"> 

<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
</head> 

<body> 
    <form method="POST" id="contact"> 
     <div class="form-group"> 
      <label for="name">Voornaam*</label> 
      <input name="fn" type="text" class="form-control" id="fn" aria-describedby="nameHelp" placeholder="John Doe" required> 
     </div> 
     <div class="form-group"> 
      <label for="name">Achternaam*</label> 
      <input name="ln" type="text" class="form-control" id="ln" aria-describedby="nameHelp" placeholder="John Doe" required> 
     </div> 
     <div class="form-group"> 
      <label for="email">Email-address*</label> 
      <input name="email" type="email" class="form-control" id="email" aria-describedby="emailHelp" placeholder="[email protected]" required> 
     </div> 
     <div class="form-group"> 
      <label for="message">Bericht*</label> 
      <textarea name="message" required class="form-control" id="message" rows="6"></textarea> 
     </div> 
     <input type="button" id="submit" value="Verstuur" class="btn btn-primary"> 
     <div id="result"> 
      <p id="result">Testing</p> 
     </div> 
    </form> 




    <script type="text/javascript"> 
     $(function(){ 
      $('input[type=button] ').click(function(){ 
       $.ajax({ 
        type: "POST", 
        url: "sendmail.php", 
        data: $("#contact").serialize(), 
        beforeSend: function(){ 
         $('#result').html('<img src="img/loading.gif" />'); 
        }, 
        succes: function(data){ 
         $('#result').html(data); 
        } 
       }); 
      }); 
     }); 
    </script> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
</body> 

</html>

PHP（sendmail.php）

<?php 
if(isset($_POST['submit'])){ 
    $to = "[email protected]"; // this is your Email address 
    $from = $_POST['email']; // this is the sender's Email address 
    $fn = $_POST['fn']; 
    $ln = $_POST['ln']; 
    $messagemail = $_POST['message']; 
    $subject = "Form submission"; 
    $subject2 = "Copy of your form submission"; 
    $message = $fn . " " . $ln . " wrote the following:" . "\n\n" . $messagemail; 
    $message2 = "Here is a copy of your message " . $fn ." ". $ln ."\n\n" . $messagemail; 

    mail($to,$subject,$message); 
    mail($from,$subject2,$message2); // sends a copy of the message to the sender 
}

來源

2017-03-10 GrayWolf

從你看過的例子中，你有嘗試過什麼嗎？你卡在哪裏？網上有關於如何使用AJAX的教程和示例，Stack Overflow並不真正試圖替代這些教程。 – David

我已經嘗試了多個示例，不太瞭解它們是如何工作的 – GrayWolf

如果遇到特定問題，我們可以幫助解決。「教我AJAX」對於Stack Overflow問題來說太廣泛了。無論如何，我們給出的示例都比*已經存在的無數示例*更好*，包括已經存在於* many * Stack Overflow問題中的示例。 – David

在這裏，您可以檢查測試代碼：

添加下面的代碼到你的HTML文件：

var data = { 
name: $("#fn").val(), 
email: $("#email").val() 
}; 

$.ajax({ 
type: "POST", 
url: "email.php",/*php file path*/ 
data: data, 
success: function(){ 
    $('.success').fadeIn(1000); 
}

}）;

來源

2017-03-10 11:38:42 Aaron

電子郵件發送表單PHP無刷新（jQuery和阿賈克斯）

回答

相關問題