Chrome独有的input标签扩展属性required?

最新推荐文章于 2022-12-28 16:47:45 发布

zl_c

最新推荐文章于 2022-12-28 16:47:45 发布

阅读量2.9k

点赞数

文章标签： chrome input 扩展 xhtml html action

本文链接：https://blog.csdn.net/zl_c/article/details/5633784

版权

今天调试一段JS的兼容性时偶然发现，<input type="text">标签加上“required” ，即：

在Chrome(版本:5.0.375.55)下提交时会自动检测它的值是否为空，如果为空则会focus到这个控件上，等待用户输入。

下面给一段完整模拟代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> </head> <body> <form action="" method="get" οnsubmit="alert('Hi!')"> <input type="text" value="" required /> <input type="submit" value="submit" /> </form> </body> </html>

提交后发现：onsubmit事件之前，Chrome先检测了输入框中的值是否为空。如果为空则执行到onsubmit中的语句，即不会弹出"Hi"。

只有当输入框中有内容时，才会触发onsubmit事件。

删除required，则不会检测。

目前本人没有找到更多关于这方面的资料，请有知道的多多指教。