在我点击输入或提交之前，jQuery 验证器不会触发

Posted 2023-05-09

【中文标题】在我点击输入或提交之前，jQuery 验证器不会触发

【英文标题】：jQuery validator does not trigger before I hit enter or submit

【发布时间】：2020-10-25 16:40:03

【问题描述】：

我正在尝试实现 jQuery Validation Plugin v1.19.2 (http://jqueryvalidation.org/)，起初它不会自动触发。它仅在我点击输入或提交表单后激活。一旦我点击输入或提交表单，它就会在 keyup 上运行。

请看下面的 gif 来理解我的意思。第一个字段（标题）是必需的，您可以看到我在那里输入了文本，然后删除了几次，但它没有显示任何错误。但是我提交后，每次都显示错误。

这是 JSFiddle 链接：http://jsfiddle.net/ubwq95e8/

$(document).ready(function() 

    $("form#signup").validate(
        
        rules: 
            title: 
                required: true                
            ,
            
        ,            
      
    );

);

【问题讨论】：

jQuery 的验证插件数不胜数，你用的是哪一个？也许插件应该是这样工作的？

对不起，我更新了帖子

【参考方案1】：

尝试在$("form#signup").validate中添加onkeyup。

查看文档：https://jqueryvalidation.org/validate/#onkeyup

onkeyup: function(element) 
   $(element).valid(); 
,

【参考方案2】：

该插件默认不会验证 onkeyup 事件，您需要根据您的要求实现它。这是一个简单的例子：

$("form#signup").validate(
         onkeyup: function (element, event) 
            $(element).valid(); 
        ,
        rules: 
            title: 
                required: true                
            ,
            
        ,
        
       errorPlacement: function(error, element)
    );

同样适用于其他事件，如 onclick、onfocus* 等

【参考方案3】：

只需添加一个自定义事件以在焦点输出时检查输入

$(document).ready(function() 

    $("form#signup").validate(
        
        rules: 
            title: 
                required: true                
            ,
            
        ,
        
       errorPlacement: function(error, element)
    );
    $('#signup input').focusout(function()
        var form = $( "#signup" );
        form.valid()
    )

);

这里是新的 jsfiddle，其中包含适用于您的案例的代码 http://jsfiddle.net/qhsj84en/