Question

我需要jquery validate插件来验证字段模糊的所有字段。目前仅在提交表格时进行验证。这是我的HTML HTML

<input class=" required minlength aplhawithaposonly" type="text" id="firstName" name="firstName" minlength="3" maxlength="40"  />

Jquery的

$(document).ready(function() {
form = $('#submitForm');
if (form.length) {
  form.validate({
    ignoreTitle: false,
    onfocusout: false,
    onkeyup: false,
    onclick: false,
    submitHandler: function() {
      form[0].submit();
    },      
    messages: { 
        firstName:{
            required: "First Name is required.",
            minlength: "First Name entered is invalid.",
            aplhawithaposonly:"First Name entered is invalid."
        }
    }
    });
});

aplhawithaposonly写在另一个js文件

中

jQuery.validator.addMethod("aplhawithaposonly", function(value, element) {
    return this.optional(element) || /^[a-zA-Z'\s]+$/i.test(value);
  }, "Please enter Alphabetic or apostrophe ' only.");

现在只有在提交表单时才会验证页面。但我希望验证发生在该领域的模糊。我试图保持onfocusout：true。但那不是解决方案。有人可以帮我解决这个问题吗？这是正在使用的js文件jquery.validate.min.js。我应该使用任何其他版本的jquery吗？请指导我..

Answer 1

引用OP：

“... 我希望验证能够在字段模糊处理 ......”

如果您希望确定焦点，那么为什么在选项中设置了onfocusout: false？

焦点验证已经是默认，因此无需设置任何选项即可实现此行为。

“......我试图保留onfocusout:true。但这不是解决。有人可以帮助我如何实现这个目标吗？”

As per the documentation，“布尔true不是有效值”。

onfocusout
类型：布尔值或函数（）
在模糊上验证元素（复选框/单选按钮除外）。如果没有输入，全部跳过规则，除非字段已标记为无效。设置为函数以自行决定何时运行验证。 布尔值true不是有效值。

换句话说，由于onfocusout验证已经是默认行为，因此您根本不应该声明此选项...只需将其保留。只有在您想要禁用onfocusout:false时才使用onfocusout: function() {...，或者当您要覆盖它时使用onfocusout:true。同样，如果您只是想要默认行为，请不要使用onsubmit。

相同的原则适用于onkeyup，onclick和if (form.length) { form.validate({ ....选项。

关于这个......

.validate()

在将.validate()方法附加到表单之前，绝对不需要测试表单的存在。 使用任何jQuery选择器，如果它与现有元素不匹配，则不会发生任何事情。

只需将$(document).ready(function() { $('#yourform').validate({ // <- initializes the plugin // options, rules, and callbacks }); });放在DOM ready事件处理程序中......

<input class="required minlength aplhawithaposonly" type="text" id="firstName"
name="firstName" minlength="3" maxlength="40"  />

关于这个......

minlength

由于您已将minlength声明为HTML5验证属性，因此class内不需要minlength。此外，将class放在true内部不起作用，因为无法传递参数。只能使用布尔class声明的规则可以在submitHandler: function() { form[0].submit(); },中声明。

关于这个......

submitHandler

这正是插件的默认行为......它是多余的代码，所以把它取出来。如果您需要覆盖默认的form操作，请使用ajax()回调，例如ignoreTitle: false,。

关于这个......

{{1}}

As per the documentation，这已经是默认行为了。最好把它拿出来。

jquery验证插件无法处理字段的模糊

1 个答案: