Question

我想在不刷新页面的情况下创建电子邮件联系表单。所以我用jquery。现在提交表单后我想向用户发送成功或错误消息。这是我的代码：

的index.html

        <!DOCTYPE html>
        <html>
        <head>
            <meta charset="utf-8">
            <title>HTML5 Contact Form</title>
            <link rel="stylesheet" media="screen" href="styles.css" >
            <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script>
$(document).ready(function(){
    $('#mycontactform').submit(function(e){
        e.preventDefault();
        $.post("contact.php", $(this).serialize(), function(response) {   
            $('#success').html(response);
            //$('#success').hide('slow');
        });
    });
});        
        </script>

        </head>
        <body>


        <form id="mycontactform" class="contact_form" action="" method="post" name="contact_form">
            <ul>
                <li>
                     <h2>Contact Us</h2>
                     <span class="required_notification">* Denotes Required Field</span>
                </li>
                <li>
                    <label for="name">Name:</label>
                    <input type="text"  id="name"  name="name" placeholder="John Doe" required />
                </li>
                <li>
                    <label for="email">Email:</label>
                    <input type="email" name="email" id="email"  placeholder="john_doe@example.com" required />
                    <span class="form_hint">Proper format "name@something.com"</span>
                </li>

                <li>
                    <label for="message">Message:</label>
                    <textarea name="message" id="message"  cols="40" rows="6" required ></textarea>
                </li>
                <li>
                    <button class="submit"  id="submit"  style="cursor:pointer" type="submit">Submit Form</button>

                    <div id="success" style="color:red;"></div>



                </li>
            </ul>
        </form>

        </body>
        </html>

contact.php

<?php
$field_name = $_POST['name'];
$field_email = $_POST['email'];
$field_message = $_POST['message'];

$mail_to = 'babloopuneeth@gmail.com';
$subject = 'Message from a site visitor '.$field_name;

$body_message = 'From: '.$field_name."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Message: '.$field_message;

$headers = 'From: '.$field_email."\r\n";
$headers .= 'Reply-To: '.$field_email."\r\n";

$mail_status = mail($mail_to, $subject, $body_message, $headers);

if ($mail_status) { 

    echo "Your email was sent!";
} else {
    echo "Your email was not sent!";
}
?>

现在提交表格后，如果邮件发送成功，我想要if如果邮件没有被发送则显示php语句我将要执行的wand else statment。但是在提交表单后我没有收到成功或错误消息，也没有收到任何邮件？我哪里错了？并且我的jquery代码是否正确提交表单而不刷新页面？ Plz有人帮助我

Answer 1

您正在将数据传递到其他页面。您需要将要显示的消息传递回原始页面，然后才会显示。你可以使用jQuery来做到这一点。

您可以在页面上设置div作为占位符

<div id="message"></div>

然后将contact.php的输出加载到其中

在不刷新页面的情况下提交表单后无法显示成功或错误消息

1 个答案: