使用jQuery防止表单提交

时间:2012-12-24 08:47:00

标签: php jquery joomla2.5

我正在使用jquery验证我的表单,如下所示:

jQuery(document).ready(function(){
        jQuery('#adminform').validate({

        rules: {
          name: {
            minlength: 5,
            maxlength: 30,
            required: true
          },
          username: {
            required: true,
            minlength: 5,
            maxlength: 30
          }
        },
        highlight: function(label) {
            jQuery(label).closest('.control-group').addClass('error');
        },
        success: function(label) {
            label
                .text('OK!').addClass('valid')
                .closest('.control-group').addClass('success');
        },
        messages:{

          name: {
            required: "Enter your name"
          },
          username: {
            required: "Enter a username"
          } 
       }
      });     
});

现在,如果规则不符合,我应该如何阻止提交表单?

当我点击提交按钮时,不会发生任何事情。

4 个答案:

答案 0 :(得分:2)

要停止提交的表单,请使用:

return false;

当您知道输入无效时。

答案 1 :(得分:1)

阻止提交事件并保留在屏幕上

e.preventDefault();

这是怎么回事?

答案 2 :(得分:1)

Prevent form submission using jQuery?

$('#myFormId').submit(function(event) {
     event.preventDefault();
 });

OR:

$('#myFormId').submit(function()
{
    return false;
});

答案 3 :(得分:0)

您的代码非常完美,只需要提交触发器: http://jsfiddle.net/uUdWN/

jQuery(document).ready(function() {
jQuery('#adminform').validate({
    rules: {
        name: {
            minlength: 5,
            maxlength: 30,
            required: true
        },
        username: {
            required: true,
            minlength: 5,
            maxlength: 30
        }
    },
    highlight: function(label) {
        jQuery(label).closest('.control-group').addClass('error');
    },
    success: function(label) {
        label.text('OK!').addClass('valid').closest('.control-group').addClass('success');
    },
    messages: {
        name: {
            required: "Enter your name"
        },
        username: {
            required: "Enter a username"
        }
    }
});


$("#adminform").submit(); // <-------------just triggered submit

});