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是提交相关领域要求

Answer 1

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

$('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; 
});