新闻动态
自动获取页面输入框问题与解决
https://www.sytm.net 发布日期:2013/8/4 7:02:13

无论在手机网站开发或电脑版网站制作中,我们大多使用Jvascripr脚本让web表单的首个输入框自动获得焦点,例如Google首页会让搜索框自动获取焦点以便直接输入搜索关键字,而无须定位光标到搜索框里。但这种方式对于多数普通用户来说的确很方便,但是对于那些高级用户或者有特殊需求的用户来说却未必如此。

JS脚本表单自动获取页面输入框问题

比如你原想按下空格键来滚动页面,但是因为焦点已经被聚到了表单中的输入框,因此页面并不会如你所愿地滚动(而是会在输入框中输入空格);再比如你在页面还在加载的时候把焦点聚焦到了其他输入框,你正想要输入什么的时候,网站的自动聚焦脚本可能"帮倒忙"地 把焦点移动到原本设定自动对焦的输入框中,从而打断了你的输入,并导致文字输入到了错误的位置。

Html5自动获取页面输入框解决思路

为了解决这个问题,HTML5标准中为所有的表单控件引入了一个autofocus属性,顾名思义这个属性的意思就是将焦点自动聚焦到特定输入框中。由于是直接采用标记而不是用javascript实现这一功能,因此所有网站的行为保持一致,而且,浏览器提供商(或者扩展程序作者)也可以为用户提供一份禁用该功能的方式。检测浏览器是否支持自动聚焦可以创建一个元素然后检测该元素的DOM对象是否拥有特定属性,如果浏览器支持自动聚焦的话,创建的<input>元素对应的DOM对象会拥有一个autofous的属性,反之,该DOM对象就不会有此属性。

HTML5的这一获取页面输入框属性,将Jvascripr脚本处理聚焦情况下的一些极端的问题,即web页面"偷"走焦点的难题轻松解决。

更多阅读
返回列表
© 2010 TianMei Technology All rights reserved. ICP:辽B2-20150138辽公网安备 21010202000010号  目录概览