jQuery验证插件-焦点事件与键/鼠标事件不一致

jQuery validation plugin - focus event inconsistent on key/mouse events

本文关键字：事件 鼠标 不一致 jQuery 插件 焦点 验证      更新时间：2023-09-26

我正在使用查询验证插件(http://docs.jquery.com/Plugins/Validation)我的目标是在提交表单之前显示错误消息。为此，我使用.valid()方法。

在出现错误之前，我不想显示这些消息，所以我会先隐藏它们。当字段第一次聚焦时，我不想显示错误消息。当用鼠标聚焦输入时，这非常有效，但是当使用tab键聚焦字段时，无论如何都会显示错误消息。

我在这里创建了一个小提琴来演示焦点问题：http://jsfiddle.net/tucsonlabs/WQnHN/4/

这应该可以工作：http://jsfiddle.net/yQRvZ/

var code;
$('input').keyup(function(e) {
    code = (e.keyCode ? e.keyCode : e.which);
    if(code == 9) {
        return false;
    }
});

每当您释放一个密钥（这是.keyup()）并且input字段集中时，jQuery代码就会检查已释放密钥的密钥代码。对于Tab，键代码是9，因此每次释放Tab时，return false;都会阻止默认事件并阻止事件冒泡。

这样效果更好：

$(document).ready(function() {
    $('#myForm').validate();
    //$('#myForm').valid();
    $('#myForm').hideErrors();
    $('input').blur(function() {
        if( !$(this).valid() ) $(this).next('label.error').show();                
    });
});​

我需要使用@mindandmedia和@Fabian的代码组合。

以下是对我有效的方法：

var code; 
$('input').keyup(function(e) {
    code = (e.keyCode ? e.keyCode : e.which);
    if(code == 9) {
        return false;
    }
});
$('#myForm').validate();
$('input').blur(function() {
    if( !$(this).valid() ) { 
         $(this).next('label.error').show();                
    }
});
相关文章：