如何使用PHP将下面的简单形式更改为Ajax运行 - How do I change the simple form below run to Ajax with PHP?

How do I change the simple form below run to Ajax with PHP?

本文关键字：运行 Ajax 简单 PHP 何使用 | 更新日期: 2023-09-27

我需要更改其标记和php代码如下所示的表单，以便在不加载页面的情况下进行操作。所以它将是一个Ajax PHP表单。请有人指导我怎么做。我将非常感激。

请注意，访客填写的表格数据副本应通过电子邮件发送给访客。

标记如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Contact form to email</title>
</head>
<body>
<div id="myemailform">
<form action="contact.php" method="post" name="myemailform">
Enter Name: <input name="name" type="text" /> 
Enter Email Address: <input name="email" type="text" /> 
Enter Message:<textarea name="message"></textarea>
<input type="submit" value="Send Form" />&nbsp;
</form>
</div>
<script type="text/javascript" src="myform.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</body>
</html>


<html>
<head>
<meta charset="utf-8">
<title>Contact form to email</title>
</head>
<body>
<form method="post" name="myemailform" action="contact.php">
Enter Name: <input type="text" name="name">
Enter Email Address:    <input type="text" name="email">
Enter Message:  <textarea name="message"></textarea>
<input type="submit" value="Send Form">
</form>
</body>
</html>

PHP代码IS（contact.PHP）：

<?php
$name = $_POST['name'];
$visitor_email = $_POST['email'];
$message = $_POST['message'];
$email_from = 'me@mysite.com';
$email_subject = "New Form submission";
$email_body = "You have received a new message from the user $name.'n".
                        "Here is the message: $message.'n";  
$aEmails = array();
$aEmails[] = 'me@mysite.com';
$aEmails[] = $visitor_email;

$headers = "From: $email_from 'r'n";
$headers .= "Reply-To: $visitor_email 'r'n";
foreach($aEmails as $aEmail) {
mail($aEmail,$email_subject,$email_body,$headers);
}

?>

JS代码：

$('form#myemailform').on('submit',function(e){
$.ajax({
    type: 'post',
    url: 'contact.php',
    data: $('form#myemailform').serialize(),
    success: function (res) {
alert(res);
}
});
e.preventDefault();
});

提前谢谢。

给表单中的id，并通过ajax传递类似的内容：

$('form#myemailform').on('submit',function(e){
$.ajax({
        type: 'post',
        url: '/your/php/page/path',
        data: $('form#myemailform').serialize(),
        success: function (res) {
            alert(res);
        }
    });
    e.preventDefault();
});

在PHP页面中，您可以访问所有POST变量。你已经准备好出发了。。。

PS：在运行此脚本之前，必须导入JQuery库。

我会尝试以下操作：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$('form').submit(function(e){
    e.preventDefault();
    var url = $(this).attr('action');
    var postdata = $(this).serializeArray(),
    $.post(url, postdata, function(results){
        //success code
    }); 
});
</script>

示例

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script>
    $('form[name=myemailform]').submit(function(e){
        e.preventDefault();
        $.ajax({
            url: $(this).attr('action'),
            type: 'post',
            data: $(this).serialize(),
            success: function(data){
                //console.log(data); //data is which is echoing in PHP end. 
            }
        });
    });
</script>