Question

我正在使用jQuery Validate来验证表单。 onfocusout参数设置为true，但是它说：

在模糊上验证元素（复选框/单选按钮除外）。如果未输入任何内容，则会跳过所有规则，除非该字段已标记为无效。

如果用户在字段内单击并且未输入任何内容，我无法找到它，那么将显示错误消息并且该字段将以红色突出显示。

如果字段为空，它将显示错误的唯一方法是输入文本，然后将其删除。我需要它来显示错误，如果我在其中单击然后单击而不输入任何内容。

有人可以告诉我该怎么做吗？

Answer 1

有问题的插件有一个专门用于在一个名为'element'的特定元素上立即运行验证的函数。您可以在onfocusout函数中使用它来强制验证该特定元素。

示例：

$('form').validate({ onfocusout: function(e) { this.element(e); } });

请参阅jsfiddle demo。

Answer 2

在我遇到填写相同的问题，然后清除所需的表单字段后，我来到这篇文章。我正在使用一个示例合并twitter bootstrap表单标记与jquery.validate.js在这里找到：http://alittlecode.com/jquery-form-validation-with-styles-from-twitter-bootstrap/

我使用以下代码解决了它：

onfocusout: function(label) {
        if($(label).val() == ''){
            $(label).closest('.control-group').removeClass('success'); 
        }
    }

以下是上下文中的完整脚本：

$(document).ready(function() {
    $('#contact_form').validate({
    rules: {
      name: {
        minlength: 2,
        required: true
      },
      email: {
        required: true,
        email: true
      },
      message: {
        minlength: 2,
        required: true
      }
    },
    onfocusout: function(label) {
        if($(label).val() == ''){
            $(label).closest('.control-group').removeClass('success'); 
        }
    },
    highlight: function(label) {
        $(label).closest('.control-group').addClass('error');
    },
    success: function(label) {
        label
            .text('OK!').addClass('valid')
            .closest('.control-group').addClass('success');
    },
    submitHandler: function(form) {
            $(form).ajaxSubmit({
                target: '#success', 
                success: function() { 
                    $('#contact_form_wrapper').hide();
                    $('#success').html('<h3>Thank you for your enquiry</h3><p class="intro-text">We will endeavour to respond to your message within 72 hours.</p>').fadeIn('slow'); 
                } 
            });         
        }
  });
});

Answer 3

将class"required"添加到您的输入中，使其看起来像

<input type="text" class="required" />

如果字段为空，这将使所需字段和模糊将触发错误。

Answer 4

试试这个：

$('input').blur(function(){
    if($(this).val() == ''){
        alert('Enter something');//here you call your desired process   
    }
});

如何使用jQuery Validate在字段为空时显示错误onblur？

4 个答案: