如何在提交后不离开页面的情况下通过用户输入发送电子邮件


How to email with user input without leaving the page after submit

我有页面(联系我.php)。我希望用户输入他们的查询和电子邮件并提交。

我只知道如何提交到下一个页面,并重定向回该页面。

我如何以这样一种方式进行编码,即当用户提交时,它会停留在同一页面上,并显示类似"已发送查询"的通知

非常感谢!

您需要使用Ajax发送电子邮件表单,如:

$.ajax({
  url: 'mail file url',
  type: 'post',
  data: {'action': 'data1': 'value1'},
  success: function(data, status) {
    if(data == "ok") {
      //your success message here 
    }
  },
  error: function(xhr, desc, err) {
    console.log(xhr);
    console.log("Details: " + desc + "'nError:" + err);
  }
}); // end ajax call

请尝试使用AJAX。通过使用AJAX,不需要更新整个页面。

如果您计划使用jQuery,请将发送电子邮件的代码放在一个文件中并调用$.ajax()。只需将表单数据作为POST或GET变量传递到此文件即可。

您可以将成功或错误的值回显到调用页面,并在调用页面中进行适当处理。

不要忘记使用filter_var()等检查从表单传递的变量。

通过Ajax调用此函数可以发送电子邮件。它将在不重新加载的情况下发送电子邮件。

function sendemail(){
var id=document.getElementById("email_id").value;
var msg=document.getElementById("message").value;
$.ajax({
url: 'mail.php?email_id='+id+"&message='+msg,
type: 'post',
data: {'action': 'data1': 'value1'},
success: function(data, status) {
if(data == "ok") {
  //your success message here 
}
},
error: function(xhr, desc, error) {
console.log("error" + error);
}
});
}

您可以使用html和jquery,但是您的php将基本保持不变。我在下面包含了html和jquery。你可以用你通常的方式做联系我们页面。

----------

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Contact Us</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script>

    $(function() {
      $("#Send").click(function(){
        var name =$("#name").val();
            $.post('contactus.php',{Name:name},function(data)
                        {
                            alert(data);
                            });


        };

   });

    </script>
</head>
<body>  
    <form method="post" onsubmit='return false;' id="form">
        Name: <input type="text" name="name" required id="name"><br>
        <input type="submit" id="Send" value="Send">
    </form>
</body>
</html>

您可以使用php邮件功能发送电子邮件,也可以使用其他插件,如PHPmailer

发送电子邮件后,您可以使用php语法在同一页面中引导页面header("Location:yourpage.php")

这就是我使用的原因

希望它能帮助你

查看具有ajax请求联系表单的两个链接

http://www.elated.com/articles/slick-ajax-contact-form-jquery-php/

http://www.sanwebe.com/2011/12/making-simple-jquery-ajax-contact-form