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

您可以将event.preventDefault();放在submithandler功能的末尾。

Answer 2

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

回调传递一个参数：

表格

类型：元素当前正在验证的表单，作为   一个DOMElement。

来自documentation

在功能结束时尝试return false;。

submitHandler: function(form) {

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

             this.disabled = 'disabled';

    });

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

    return false;
    }

fadeOut（）方法不适用于event.preventdefault（）

2 个答案: