Question

我无法在不刷新页面的情况下将AJAX表单转换为POST到我的PHP脚本。

我在AJAX请求之前和之后都添加了e.preventDefault()，但它似乎没有任何影响，这看起来很奇怪。

这是我的javascript：

// AJAX form submit
$("form[name=signoutRequestForm]").on("submit", function(e){

    var cval = confirm.val().toLowerCase().replace(" ", "");
    if( cval !== "yes"  ) {
        alert("You must accept the borrowing policy.");
    }else{
        var formData = {
            validForm: true,
            name_txt: name.val(),
            productName_sel: prodName.val(),
            signoutDateStart_txt: startDate.val(),
            signoutDateEnd_txt: returnDate.val(),
            additionalNotes_txtarea: addNotes.val(),
            disclaimer_txt: confirm.val(),
            recaptcha_challenge_field: recap_challenge.val(),
            recaptcha_response_field: recap_response.val(),
            studentUse: studentUse.val()
        };

        $.ajax({
            type: "POST",
            ulr: confLocation,
            data: formData,
            done: function(data){
                $(".signoutRequestForm").remove();
                $(".signout-form-container").html( data );
            }
        });
    }
    e.preventDefault();
});

现在，当我点击提交时，页面似乎刷新而没有实际提交的表单。

Answer 1

根据评论，确定对.on()的调用导致异常（TypeError: undefined is not a function）并且您正在使用jQuery v1.5.2。

直到1.7版才添加

.on()。对于旧版本，应使用.bind()代替。

Answer 2

只需使用return false

    .....
    e.preventDefault();
    return false
});

Answer 3

使用return false;代替e.preventDefault()

使用jQuery / AJAX提交表单，无法在提交时刷新页面？

3 个答案: