javascript - fadeOut() 方法不适用于 event.preventdefault()

Question

当我的表单被提交和验证时，我希望我的对话框淡出并关闭，我不希望页面自动刷新。如果我使用 preventdefault 页面不会刷新，但对话框也不会关闭。我还需要做什么？

$("#form").validate({
    rules: {
          number : {
            required: true
        }                                        
    },
    messages: {
        number : {
            required: "enter a phone number"                   
        }
    },
    submitHandler: function(form,event) {

        event.preventDefault();

    //this prevents a double click on the form button

    $("form :input:submit").click(function() {

             this.disabled = 'disabled';

    });

     //Here I want the dialog to slowly fade, then close, *then* reload the page. 
     //but it won't fade or close when I'm using preventDefault(). 

    $('#dialog').fadeOut('slow', function(){
            $( this ).dialog( "close" );
          location.reload();
        });


    }  //closes submit handler  
});//close validate

Answer 1

问题是submitHandler仅接收 1 个参数form，因此尝试调用 event.preventDefault();将导致异常并停止执行以下脚本。

回调传递了一个参数：

形式

类型：Element 当前正在验证的表单，作为 DOMElement。

从文档

return false;在函数结束时尝试。

submitHandler: function(form) {

    $("form :input:submit").click(function() {

             this.disabled = 'disabled';

    });

    $('#dialog').fadeOut('slow', function(){
            $( this ).dialog( "close" );
          location.reload();
        });

    return false;
    } 

Answer 2

你可以把你的功能 放在event.preventDefault();最后。submithandler