Question

大家好，我按发送电子邮件时，我的联系表格示例已经有问题，电子邮件仍在发送，但页面无法执行任何操作，甚至无法显示成功消息，我希望在按提交后清除联系表格按钮。website

我的html代码

  <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12">
                        <div class="contact-form mb50 wow fadeIn">
                            <h2>Send Message</h2>
                            <form action="process.php" id="contact-form" method="post">
                                <div class="form-group" id="name-field">
                                    <div class="form-input">
                                        <input type="text" class="form-control" id="form-name" name="form-name" placeholder="Name.." required>
                                    </div>
                                </div>
                                <div class="form-group" id="email-field">
                                    <div class="form-input">
                                        <input type="email" class="form-control" id="form-email" name="form-email" placeholder="Email.." required>
                                    </div>
                                </div>
                                <div class="form-group" id="phone-field">
                                    <div class="form-input">
                                        <input type="text" class="form-control" id="form-phone" name="form-phone" placeholder="Phone...">
                                    </div>
                                </div>
                                <div class="form-group" id="message-field">
                                    <div class="form-input">
                                        <textarea class="form-control" rows="6" id="form-message" name="form-message" placeholder="Your Message Here..." required></textarea>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <button type="submit">Send Message</button>
                                </div>

我的process.php代码

<?php
// Configure your Subject Prefix and Recipient here
$subjectPrefix = '[Contact Form Website]';
$emailTo       = '<info@mywebsite.com>';
$errors = array(); // array to hold validation errors
$data   = array(); // array to pass back data
if($_SERVER['REQUEST_METHOD'] === 'POST') {
    $name    = stripslashes(trim($_POST['name']));
    $email   = stripslashes(trim($_POST['email']));
    $phone = stripslashes(trim($_POST['phone']));
    $message = stripslashes(trim($_POST['message']));
    if (empty($name)) {
        $errors['name'] = 'Name is required.';
    }
    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $errors['email'] = 'Email is invalid.';
    }
    if (empty($phone)) {
        $errors['phone'] = 'Phone is required.';
    }
    if (empty($message)) {
        $errors['message'] = 'Message is required.';
    }
    // if there are any errors in our errors array, return a success boolean or false
    if (!empty($errors)) {
        $data['success'] = false;
        $data['errors']  = $errors;
    } else {
        $subject = "$subjectPrefix $subject";
        $body    = '
            <strong>Name: </strong>'.$name.'<br />
            <strong>Email: </strong>'.$email.'<br />
            <strong>Phone: </strong>'.$phone.'<br />
            <strong>Message: </strong>'.nl2br($message).'<br />
        ';
        $headers  = "MIME-Version: 1.1" . PHP_EOL;
        $headers .= "Content-type: text/html; charset=utf-8" . PHP_EOL;
        $headers .= "Content-Transfer-Encoding: 8bit" . PHP_EOL;
        $headers .= "Date: " . date('r', $_SERVER['REQUEST_TIME']) . PHP_EOL;
        $headers .= "Message-ID: <" . $_SERVER['REQUEST_TIME'] . md5($_SERVER['REQUEST_TIME']) . '@' . $_SERVER['SERVER_NAME'] . '>' . PHP_EOL;
        $headers .= "From: " . "=?UTF-8?B?".base64_encode($name)."?=" . "<$email>" . PHP_EOL;
        $headers .= "Return-Path: $emailTo" . PHP_EOL;
        $headers .= "Reply-To: $email" . PHP_EOL;
        $headers .= "X-Mailer: PHP/". phpversion() . PHP_EOL;
        $headers .= "X-Originating-IP: " . $_SERVER['SERVER_ADDR'] . PHP_EOL;
        mail($emailTo, "=?utf-8?B?" . base64_encode($subject) . "?=", $body, $headers);
        $data['success'] = true;
        $data['message'] = 'Congratulations. Your message has been sent successfully';
    }
    // return all our data to an AJAX call
    echo json_encode($data);
}

我的contact-form.js代码

(function ($, window, document, undefined) {
    'use strict';

    var $form = $('#contact-form');

    $form.submit(function (e) {
    // remove the error class
    $('.form-group').removeClass('has-error');
    $('.help-block').remove();

    // get the form data
    var formData = {
        'name' : $('input[name="form-name"]').val(),
        'email' : $('input[name="form-email"]').val(),
        'phone' : $('input[name="form-phone"]').val(),
        'message' : $('textarea[name="form-message"]').val()
    };

    // process the form
    $.ajax({
        type : 'POST',
        url  : 'process.php',
        data : formData,
        dataType : 'json',
        encode : true
    }).done(function (data) {
        // handle errors
        if (!data.success) {
            if (data.errors.name) {
                $('#name-field').addClass('has-error');
                $('#name-field').find('.form-input').append('<span class="help-block">' + data.errors.name + '</span>');
            }

            if (data.errors.email) {
                $('#email-field').addClass('has-error');
                $('#email-field').find('.form-input').append('<span class="help-block">' + data.errors.email + '</span>');
            }

            if (data.errors.phone) {
                $('#phone-field').addClass('has-error');
                $('#phone-field').find('.form-input').append('<span class="help-block">' + data.errors.phone + '</span>');
            }

            if (data.errors.message) {
                $('#message-field').addClass('has-error');
                $('#message-field').find('.form-input').append('<span class="help-block">' + data.errors.message + '</span>');
            }
        } else {
            // display success message
            $form.html('<div class="alert alert-success">' + data.message + '</div>');
        }
    }).fail(function (data) {
        // for debug
        console.log(data)
    });

    e.preventDefault();
});
}(jQuery, window, document));

Answer 1

发送成功后，只需在函数末尾的Js中添加location.reload()吗？

Answer 2

尝试在js中添加一个函数

function myFunction() {
   location.replace("https://URL")
}

然后是onclick="myFunction()"

提交联系表后刷新页面

2 个答案: