PHP请求未到达jQuery脚本

Question

我正在尝试创建一个带有javascript验证的邮件表单。表单值应与ajax一起发送到php脚本，后者将数据通过电子邮件发送到电子邮件地址。

然而，php代码既没有成功调用，也没有错误的jquery回调被调用，在chrome的javascript控制台中也没有任何日志。

这是我的简化html页面：

<form id="mail-form">
    <div class="input-row">
    <div class="label"><label for="name">Your name: *</label></div>
    <div class="input"><input type="text" name="name" id="name" maxlength="50"/></div>
        <input id="submit-button" type="submit" value="send"/>
</form>

我的javascript：

$(document).ready(function () {
    var form = $("#mail-form");

    form.submit(function (e) {
        e.preventDefault();
        send(form);
    }
});

function send(form) {

    var formData = { name: $("#name").val(),
        email: $("#email").val(),
        phone: $("#phone").val(),
        message: $("#message").val(),
    };

    $.ajax({
        type: "POST",
        url: "/scripts/mailer.php",
        datatype: "text",
        data: formData,
        succes: function (data) {
            onSucces();
        },
        error: function () {
            onError();
        }
    });
}

和我简化的php文件：

$myemail = "someone@something.com";
$subject = "test";

$message = $_POST["message"];

mail($myemail, $subject, $message);

echo "ok";

有人能指出我做错了什么吗？我也尝试过简单的get方法，但它们也不能到达服务器。

Answer 1

像这样试一下：

更改：

$(document).ready(function () {
    var form = $("#mail-form");

    form.submit(function () {
        e.preventDefault();
        send(form);
        }
    });
});

至：

$("#mail-form").submit(function (e) {
        e.preventDefault();
        send(form);
});

所以看起来是这样的：

$("#mail-form").submit(function (e) {
        e.preventDefault();
        send(form);
});

function send(form) {

    var formData = { name: $("#name").val(),
        email: $("#email").val(),
        phone: $("#phone").val(),
        message: $("#message").val(),
    };

    $.ajax({
        type: "POST",
        url: "/scripts/mailer.php",
        datatype: "text",
        data: formData,
        success: function (data) {
            onSucces();
        },
        error: function () {
            onError();
        }
    });
}

Answer 2

在你的JavaScript上试试这个；success是错误的，你的submit()调用中有一个毫无意义的括号：

$(document).ready(function () {
    var form = $("#mail-form");
    form.submit(function (e) {
        send(form);
        e.preventDefault();
        return(false);
    });
});
function send(form) {
    var formData = {
        name: $("#name").val(),
        email: $("#email").val(),
        phone: $("#phone").val(),
        message: $("#message").val(),
    };
    $.ajax({
        type: "POST",
        url: "/scripts/mailer.php",
        datatype: "text",
        data: formData,
        success: function(data){
            onSucces();
        },
        error: function(){
            onError();
        }
    });
}

Answer 3

永远不要依赖客户端的数据验证。

对于您的问题，请使用alert确认成功或错误回调函数均未执行。您还可以删除dataType，看看这是否有什么不同。

您也可以这样做

var formData = form.serialize();

而不是这个

var formData = { name: $("#name").val(),
    email: $("#email").val(),
    phone: $("#phone").val(),
    message: $("#message").val(),
};