HTML5泡泡消息

Pij*_*usn 3 javascript forms html5 popup

需要输入字段的新HTML5属性,在提交表单时弹出气泡消息且字段为空.有没有办法用不同的文字弹出同一个泡泡?我想将它用于不同的验证(不仅仅是它是否为空).

以下是Chrome中此气泡(弹出窗口)的屏幕截图:

泡泡消息

ale*_*kas 7

HTML5提供了一个名为setCustomValidity的方法来实现这一点.此方法是一个低级API,用于添加新的验证约束并添加新的/更改错误消息.您必须调用脚本,删除/添加验证消息 - 使用setCustomValidity - (在"DOMready"和"输入/更改时).

我编写了一个polyfill脚本,它不仅在所有浏览器中实现了这些HTML5表单方法,而且还添加了"customValidity"-helper,这使得使用自定义消息添加自定义验证约束变得更加容易.

注意:您无需实现webshims lib即可使用此脚本.它也适用于没有webshims lib.(但是如果你使用webshims lib,你将在包括IE6在内的所有浏览器中获得约束验证).如果您不想使用此跨浏览器,只需使用validity-helper脚本.文档在这里.

请注意,如果您通过设置自定义消息对消息进行更改,则必须包括清除消息的方法,例如

myFormElement.setCustomValidity( '');

如果您不清除该消息,表单元素将被视为无效,表单将不会提交.