为什么当我在Chrome中调试时jQuery ajax调用才起作用？

Question

我有一个来自表单提交的简单ajax调用。当我调试时它可以工作，即弹出警报，但是在运行它时不起作用？

这对我来说似乎有点神秘。

$(function(){

    $("#signUpForm").submit(function(){
        var request = $.ajax({
            url:"php/newUser.php",
            type:"POST"

        });

        request.done(function(msg){
            alert(msg);
        });


    });
});

Answer 1

如果您在表单的.submit（）处理程序上运行ajax调用，则将触发
Ajax请求，但随后该表单将继续提交，从而刷新页面并且从不触发您的回调函数。

相反，您应该event.preventDefault()在Submit
handler函数的末尾调用，以防止浏览器使用新的HTTP请求正常提交表单。为此，您需要将其event作为参数添加到回调函数中，如下所示：

$( "#target" ).submit(function( event ) {
  alert( "Handler for .submit() called." );
  event.preventDefault();
});

它在调试时起作用的原因是，在浏览过程中，所有事情都会缓慢进行，而浏览器无需提交表单。