当前位置:Gxlcms > html代码 > HTML5注册表单的自动聚焦与占位文本示例代码_html5教程技巧

HTML5注册表单的自动聚焦与占位文本示例代码_html5教程技巧

时间:2021-07-01 10:21:17 帮助过:15人阅读

首先看下面要使用HTML自动聚焦和占位文本的示例代码

代码如下:

2:

注册帐号







使用自动聚焦
要使用HTML5的自动聚焦功能,只需要在表单域中添加autofocus属性即可
例如上面,想让页面加载完成时自动将光标定位到表单的第一个表单域邮箱上以及提高输入效率。

代码如下:







  • 需要注意的是,如果页面中设置了多个autofocus属性,那么用户的光标只会定位到最后一个设置了autofocus属性的表单域上。
    使用占位文本
    占位文本的最大用处,就是向用户说明应该如何正确的填写表单。即进行输入提示。要使用占位文本的话,只需要在输入域中添加placeholder属性即可
    下面是使用了placeholder属性的输入表单域

    代码如下:
























    运行效果如下

    是否启用自动完成
    在HTML5中引入了autocomplete属性。用来通知浏览器是否为当前表单域自动填充数据。某些浏览器会记住用户之前输入的数据,而在某些情况下,我们可能并不希望用户使用记录数据,特别类似于密码这一类的
    关闭自动完成

    代码如下:



    只需要将atuocomplete的值设置成off,就可以阻止自动完成。

    人气教程排行