为什么jQuery ajax调用仅在我在Chrome中调试时才有效？

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()在提交处理程序函数的末尾调用,以防止浏览器使用新的HTTP请求正常提交表单.为此,您需要将event参数添加到回调函数中,如下所示:

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

调试时它起作用的原因是因为一切都在你单步执行时缓慢发生,而浏览器没有提交表单.