Question

所以我用php，css和html制作了一个小小的联系表格。但是当我尝试添加电子邮件验证时，它仍会发送电子邮件，并且不会将输入的样式更改为红色（就像我希望的那样）。我遇到的另一个问题是按钮重定向到页面顶部（我不希望它这样做）。最后我可以让输入保留文本而不是在提交后将其删除

HTML：

<div id="contact">
        <div class="container"> 
            <form id="contact-form" method="post">
            <h1>Contact Form</h1>
            <fieldset>
                <input placeholder="Your Name" type="text" name="name" required>
            </fieldset>
            <fieldset>
                <input placeholder="Your Email Address" type="email" name="email" id="email-input" required>
            </fieldset>
            <fieldset>
                <input placeholder="Your Phone Number (optional)" type="tel" name="phone" required>
            </fieldset>
            <fieldset>
                <input placeholder="Your Web Site (optional)" type="url" name="site" required>
            </fieldset>
            <fieldset>
                <textarea placeholder="Type your message here...." name="message" required></textarea>
            </fieldset>
            <fieldset>
                <button type="submit" id="contact-submit" name="submit">Submit</button>
            </fieldset>
            </form>
        </div>
    </div>

PHP：

<?php 
        $name = $_POST['name'];
        $email = $_POST['email'];
        $phone = $_POST['phone'];
        $visitors_site = $_POST['site'];
        $message = $_POST['message'];

        $email_from = 'mattmowen1@gmail.com';
        $email_subject = 'New Contact Submission';

        $to = 'mattmowen1@gmail.com';
        $headers = "From:" . $email;
        $headers = "Contact Submission From: " . $email;
        $message1 = "Name: " . $name;
        $message2 = "\n\nEmail: " . $email;
        $message3 = "\n\nPhone: " . $phone;
        $message4 = "\n\nTheir Site: " . $visitors_site;
        $message5 = "\n\nMessage: " . $message;
        $email_body = $message1 . $message2 . $message3 . $message4 . $message5;

        if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
            mail($to, $email_subject, $email_body,$headers);            
        } else {
            echo "<style>#email-input {color:red}</style";
        }
?>

Answer 1

试试这个，以便在php

中进行电子邮件验证

<?php 

if (isset($_POST) && !empty($_POST)) {
        $name = $_POST['name'];
        $email = $_POST['email'];
        $phone = $_POST['phone'];
        $visitors_site = $_POST['site'];
        $message = $_POST['message'];

        $email_from = 'mattmowen1@gmail.com';
        $email_subject = 'New Contact Submission';

        $to = 'mattmowen1@gmail.com';
        $headers = "From:" . $email;
        $headers = "Contact Submission From: " . $email;
        $message1 = "Name: " . $name;
        $message2 = "\n\nEmail: " . $email;
        $message3 = "\n\nPhone: " . $phone;
        $message4 = "\n\nTheir Site: " . $visitors_site;
        $message5 = "\n\nMessage: " . $message;
        $email_body = $message1 . $message2 . $message3 . $message4 . $message5;

        if (!filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
          mail($to, $email_subject, $email_body,$headers);
        } else {
          echo "<style>#email-input {color:red}</style>";
        }
}
?>

根据我们的聊天对话。我根据你的表单要求添加了jquery ajax函数。您需要创建新文件email.php并将您的PHP代码放入这个单独的php文件

<script>
    var url = 'email.php';
    $.ajax({
        url : url,
        type : "POST",
        dataType : "JSON",
        data : $('#contact-form').serialize(),
        success : function(response) {
            if (response.error == 0) { // success
                $('#contact-form')[0].reset();
                alert('Form submitted successfully. We will contact you asap.');
            } else { // error
                $('#email-input').css('color', 'red');//in case of email error
                alert('ERROR MESSAGE');//form is invalid
            }
        }
    })

</script>

要处理JSON请求，您需要发送JSON对象作为响应。所以改变你的PHP代码片段如下：

if (!filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
  mail($to, $email_subject, $email_body,$headers);
  exit(json_encode(array('error' => 0)));
} else {
  exit(json_encode(array('error' => 1)));
}

PHP电子邮件和网址验证

1 个答案: