Question

我正在对Web应用程序上的现有表单进行一些修改。我无法访问表单的代码，但我可以在页面中添加脚本，所以我在jQuery的帮助下进行了一些自定义。

所以，现在我有这样的事情：

jQuery( "#new_user" ).submit(function( event ) {

    event.preventDefault();

var fullname = jQuery("#user_name").val();
var email = jQuery("#email_primary").val();
var company = jQuery("#contact_customer").val();

jQuery.ajax({
        async: false,
        dataType: 'jsonp',
        url:"https://server.com/script.php",
        data: {"fullname": fullname, "email": email, "company": company},
        success: function(response){
        alert("json says " +response.res);
        }
});
    alert("hello");
});

现在，这很好用。我基本上是在拦截表单提交。

问题是，只有当我在那里保持alert（）调用时才执行ajax调用，这显然是我不想要的，它只是用于调试。如果我删除alert（）调用，表单将提交，但ajax调用将无法正常工作。我可以访问应该接收JSONP请求的Web服务器，它甚至没有到达那里。

第二个警报实际上永远不会被执行，但实际上我不需要任何东西，我只需要在网络服务器上接收GET。

我曾尝试将async：false添加到ajax（）选项中，但没有运气。

我有点困惑，并且对它进行了相当多的研究/实验。任何小费都表示赞赏，提前谢谢。

Answer 1

您必须阻止表单提交，否则将取消ajax请求

jQuery( "#new_user" ).submit(function( event ) {
    event.preventDefault()
    jQuery.ajax(...);
    alert("hello");
});

Answer 2

你想提交关于ajax成功的表格，对吧？

jQuery( "#new_user" ).submit(function( event ) {
    event.preventDefault()
    var self = jQuery(this);
    jQuery.ajax({
        async: false,
        dataType: 'jsonp',
        url:"https://server.com/script.php",
        data: {"fullname": fullname, "email": email, "company": company},
        success: function(response){
            alert("json says " +response.res);
            self.submit();
    });
});

jQuery：ajax调用没有在表单提交事件上执行，除非我之后有一个警报调用？

2 个答案: