javascript 使用 Ajax/jQuery/PHP 发送联系表单数据

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19148165/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 14:33:23  来源:igfitidea点击:

Sending contact form data using Ajax/jQuery/PHP

javascriptphpjqueryhtmlajax

提问by Sam Holguin

I had a functioning contact form, but decided to try learn a little Ajax to improve usability and error checking. I'm using code from this examplewhich I've adapted slightly to accommodate the new .ajaxComplete() guidelines.

我有一个功能正常的联系表,但决定尝试学习一点 Ajax 以提高可用性和错误检查。我正在使用此示例中的代码,我对其进行了一些修改以适应新的 .ajaxComplete() 指南。

I've zero idea why this isn't working, but I'll provide both my form, ajax request and working example in the hope someone can help:

我不知道为什么这不起作用,但我会提供我的表单、ajax 请求和工作示例,希望有人能提供帮助:

My website

我的网站

JS

JS

$(document).ready(function() {

    $("#get-contact-form").submit(function() {

    var str = $(this).serialize();

        $.ajax({
            type: "POST",
            url: "contact-process.php",
            data: str,
            success: function(msg) {

                $(document).ajaxComplete(function(event, request, settings) {

                if (msg == 'OK') {

                    result = '<div class="notification_ok">Your message has been sent Succesfully. Thank you!!!</div>';
                    $("#fields").hide();

                }
                else
                {

                    result = msg;

                }

                $("#note").hide();
                $("#note").html(result).slideDown("slow");
                $("#note").html(result);

                });

            }

        });

    return false;

    });

});

PHP(Please note I've removed all validation here to make it easier to follow)

PHP(请注意,我在这里删除了所有验证,以便更容易理解)

$title     = $_POST["Form"]["title"];
$forename  = trim($_POST["Form"]["forename"]);
$surname   = trim($_POST["Form"]["surname"]);
$telephone = trim($_POST["Form"]["telephone"]);
$email     = trim($_POST["Form"]["email"]);
$message   = trim($_POST["Form"]["message"]);

$name = $title . " " . $forename . " " . $surname;

require_once("inc/PHPMailer/class.phpmailer.php");

$mail = new PHPMailer();

$email_body = "";
$email_body = $email_body . "<h1 class='heading'><strong>Name:</strong></h1><br />" . $name . "<br />";
$email_body = $email_body . "<h1 class='heading'><strong>Telephone Number:</strong></h1><br />" . $telephone . "<br />";
$email_body = $email_body . "<h1 class='heading'><strong>Email:</strong></h1><br />" . $email . "<br />";
$email_body = $email_body . "<h1 class='heading'><strong>Message:</strong></h1><br />" . $message;

$mail->IsSMTP();
$mail->SMTPAuth = true;
$mail->SMTPSecure = "ssl";
$mail->Host = "smtp.gmail.com";
$mail->Port = 465;
$mail->Username = "****";
$mail->Password = "****";

$mail->SetFrom($email, $name);
$address = "*******";
$mail->AddAddress($address, "*****");
$mail->Subject = "Email Subject | " . $name;
$mail->MsgHTML($email_body);

HTML

HTML

<form class="cf form-contact" id="get-contact-form" action="javascript:alert('success!');" >
    <div id="note"></div>
    <div id="fields">
        <div class="row grid-full">
            <label for="title">Title</label>
            <select name="Form[title]" id="title">
                <option value="Mr">Mr</option>
                <option value="Mrs">Mrs</option>
                <option value="Ms">Ms</option>
                <option value="Miss">Miss</option>
                <option value="Dr">Dr</option>
            </select>
        </div>
        <div class="grid-2">
            <label for="forname">First Name</label>
            <input type="text" name="Form[forename]" id="forename" />
            <label for="surname">Last Name</label>
            <input type="text" name="Form[surname]" id="surname" />
        </div>
        <div class="grid-2">
            <label for="telephone">Telephone</label>
            <input type="text" name="Form[telephone]" id="telephone" />
            <label for="email">Email Address</label>
            <input type="text" name="Form[email]" id="email" />
        </div>
        <div class="row grid-4" style="display: none;">
            <label for="address">Address</label>
            <input type="text" name="Form[address]" id="address" />
            <p>Please leave this field blank.</p>
        </div>
        <div class="row grid-4">
            <label for="message">Comments</label>
            <textarea rows="12" name="Form[message]" id="message"></textarea>
            <button type="submit" class="btn">Submit</button>
        </div>
    </div>
</form>

采纳答案by Emilio Gort

According to the documentationyou are missing this lines in your php

根据文档,您在 php 中缺少这一行

if(!$mail->send()) {
   echo 'Message could not be sent.';
   echo 'Mailer Error: ' . $mail->ErrorInfo;
   exit;
}else{
   echo 'ok';
}