Chrome在jquery表单验证时失败

Question

有人可以向我解释为什么the form validation fails in chrome？

按提交应将空白字段显示为红色。

我不知道为什么铬会失败 - 很乐意找到解决方案......

$('form .meet').focus(function() {
    $('form .required').each(function() {
        if($(this).val() == '') {
            $(this).addClass('warning');
        }
    })
});
$('form .meet').click(function() {
    output = true;
    if($('form .warning').length > 0) {
        $(this).addClass('disabled').attr('disabled','disabled');
        output = false;
    }
    return output;
});
$('form .required').keyup(function() {
    if($(this).val()) {
        $(this).removeClass('warning');
        if($('form .warning').length == 0) {
            $('form .meet').removeClass('disabled').removeAttr('disabled');
        }
    }
});

• .required是可能不为空的输入字段
• .meet是与.required
相关的提交字段

Answer 1

在Chrome中，点击事件会在焦点前触发。您的代码期望焦点事件首先发生（将警告类分配给空输入）。您应该在点击时执行输入字段值评估。

$('form .meet').click(function() {
    output = true;
    $('form .required').each(function() {
        if($(this).val() == '') {
            $(this).addClass('warning');
        }
    });
    if($('form .warning').length > 0) {
        $(this).addClass('disabled').attr('disabled','disabled');
        output = false;
    }
    return output;
});