绵阳梓潼网站制作公司

如何完成HTML5注册表单的自动聚焦与占位文本-创新互联

这篇文章给大家介绍如何完成HTML5注册表单的自动聚焦与占位文本，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。

成都创新互联-专业网站定制、快速模板网站建设、高性价比榆林网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式榆林网站制作公司更省心,省钱,快速模板网站建设找我们，业务覆盖榆林地区。费用合理售后完善，十年实体公司更值得信赖。

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


代码如下:

 2:  
 
注册帐号 
 
 
 
 
 
新用户注册 

     

  1.  
邮 箱 
 

    2.  

  2.  
 用户名 
 

    3.  

  3.  
 显示名称 
 

    4.  

  4.  
密码 
 

    5.  

  5.  
确认密码 
 

    6.  

 
 
 
 


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


代码如下:

  •  
邮 箱 
 

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


    代码如下:

       

    1.  
邮 箱 
 

      2.  

    2.  
 用户名 
 

      3.  

    3.  
 显示名称 
 

      4.  

    4.  
密码 
 

      5.  

    5.  
确认密码 
 

      6.  

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


    代码如下:

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

    关于如何完成HTML5注册表单的自动聚焦与占位文本就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。


    网页名称：如何完成HTML5注册表单的自动聚焦与占位文本-创新互联
    文章地址：http://myzitong.com/article/coiooe.html

    其他资讯