我一直在使用$(‘select [required]’).is(‘：invalid’)如果浏览器支持pattern属性if(Modernizr.input.pattern){},它在Firefox 4-7中工作正常,但Chrome和Safari都有问题.
所有其他验证工作正常,它只需要选择菜单,即< select required>< option>< / option>< / select>
这是我的jsfiddle：http://jsfiddle.net/mbCbt/.基本上,你选择一个下拉项,它的意思是验证它.
在firefox中,选择’test’会说它有效.选择“请选择”将表示其无效.
在Safari / Chrome中,选择“测试”会显示无效,然后选择“请选择”会使其有效.再次选择测试将使其无效.从那里,选择test2,它将是VALID,然后再次选择test,这次它将是有效的.
我假设它是一个jQuery的东西,因为浏览器正在从CSS中识别它的有效性…
思考？我意识到这个函数没有任何官方支持(不是在jquery kb中),但我希望还有另一种解决方法.我已经降低了对旧浏览器的验证检查,所以也许我应该回到webkit的那个？
解决方法
在我看来像一个Safari bug.验证器是正确的,但只是第二次调用它.当您调用is(‘：invalid’)时,它将返回先前的验证.
我尝试了你的例子,并调用(this.validity()),但它返回相同的东西.只有CSS是准确的！
我很难理解如何轻松获得这个 – DOM不会返回CSS的值.我试着检查$(this).css(‘border’)和this.style.borderColor来获得结果,没有骰子.
UPDATE
在任何验证发生之前,change()事件都会触发.发出警报(‘这里’);在你的.is前面(‘：无效’);显示该元素仍然是无效CSS属性中的“红色”.
如果您在经过一段时间后尝试验证,请通过window.setTimeout(doValidateTest(这个),10)或者某些,那么它可能会正确返回.
