微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery:带有必需select元素的HTML 5表单无效

我一直在使用$(‘select [required]’).is(‘:invalid’)如果浏览器支持pattern属性if(Modernizr.input.pattern){},它在Firefox 4-7中工作正常,但Chrome和Safari都有问题.

所有其他验证工作正常,它只需要选择菜单,即< select required>< option>< / option>< / select>

这是我的jsfiddlehttp://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)或者某些,那么它可能会正确返回.

原文地址:https://www.jb51.cc/jquery/180699.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐