AJAX激发成功和错误

时间:2015-02-09 15:53:46

标签: javascript jquery ajax

我不确定为什么我的ajax请求的error:部分也会被解雇。成功和错误部分都是实际触发。我是JS / jQuery的新手,但我读到成功在ajax请求成功时触发,并在出现错误时触发错误。我认为成功意味着200,错误意味着400-500?

JS:

    function create_post() {
        console.log("create post is working");
        var firstName = document.getElementById("firstname");
        var lastName = document.getElementById("lastname");
        var email = document.getElementById("email");
        var phoneNumber = document.getElementById("phonenumber");
        var message = document.getElementById("message");
        var contactInfo = {
            "first_name": firstName.value,
            "last_name": lastName.value,
            "email": email.value,
            "phone_number": phoneNumber.value,
            "message": message.value
        };

        $.ajax({
            url: "",
            type: "POST",
            data: contactInfo,
            success: ajaxSuccess(contactInfo),
            error: console.log("ajax fail")

        });
    };


    function ajaxSuccess(contactInfo) {
        console.log(contactInfo);
        // clear form data
        document.getElementById("contact-form").reset();
        // display modal
    }


//    Contact form submit
    var contactForm = document.getElementById("contact-form");
    $(contactForm).on('submit', function(event) {
        event.preventDefault();
        console.log("form submitted");
        create_post();
    });

enter image description here

2 个答案:

答案 0 :(得分:6)

您的问题出在以下几行:

success: ajaxSuccess(contactInfo),
error: console.log("ajax fail")

这会立即有效地运行这两个函数,并将这些函数的返回值设置为successerror属性。尝试使用匿名回调函数。

success: function() {
    ajaxSuccess(contactInfo);
},
error: function() {
    console.log("ajax fail");
}

答案 1 :(得分:5)

调用函数并将返回值传递给successerror。你需要传递实际的功能。

因为在这两种情况下,您都在对函数的参数进行硬编码,所以可以使用bind来创建新函数。

success: ajaxSuccess.bind(window, contactInfo),
error: console.log.bind(console, "ajax fail")