jquery - 为什么 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();
});

它在调试时起作用的原因是，当您单步执行时，一切都会缓慢发生，而浏览器不会提交表单。