html5 button autofocus 属性介绍及应用


Posted in HTML / CSS onJanuary 04, 2013

在html 5中,可以设置当页面加载时,自动焦点到达某个控件中,这个就是autofocus属性了,如下:

复制代码
代码如下:

<input autofocus="autofocus" />
<button autofocus="autofocus">Hi!</button>
<textarea autofocus="autofocus"></textarea>

浏览器支持该属性的有
fiefox 4+,safari 5+,chrome 6+,opera 11+,ie 10, 而android 2.3和safari mobile 5-都不支持

实例
当页面加载时,会获得焦点的一个按钮:

复制代码
代码如下:

<button type="button" autofocus="autofocus">
点击这里
</button>

亲自试一试
定义和用法
autofocus 属性规定当页面加载时按钮应当自动地获得焦点。

如果使用该属性,则按钮会获得焦点。
HTML 4.01 与 HTML 5 之间的差异
autoplay 属性是 HTML 5 中的新属性。
语法

复制代码
代码如下:

<button autofocus="autofocus">
HTML / CSS 相关文章推荐
使用CSS3制作倾斜导航条和毛玻璃效果
Sep 12 HTML / CSS
CSS3使用border-radius属性制作圆角
Dec 22 HTML / CSS
详解CSS3中border-image的使用
Jul 18 HTML / CSS
CSS3 清除浮动的方法示例
Jun 01 HTML / CSS
CSS3 box-shadow属性实例详解
Jun 19 HTML / CSS
详解css3中的伪类before和after常见用法
Nov 17 HTML / CSS
CSS3 真的会替代 SCSS 吗
Mar 09 HTML / CSS
HTML5 canvas基本绘图之绘制线段
Jun 27 HTML / CSS
html5嵌入内容_动力节点Java学院整理
Jul 07 HTML / CSS
详解移动端HTML5音频与视频问题及解决方案
Aug 22 HTML / CSS
html5+css3气泡组件的实现
Nov 21 HTML / CSS
html5手机键盘弹出收起的处理
Jan 20 HTML / CSS
html5的新玩法——语音搜索
Jan 03 #HTML / CSS
HTML5 语音搜索只需一句代码
Jan 03 #HTML / CSS
HTML5 语音搜索(淘宝店语音搜素)
Jan 03 #HTML / CSS
html5拖曳操作 HTML5实现网页元素的拖放操作
Jan 02 #HTML / CSS
使用CSS实现弹性视频html5案例实践
Dec 26 #HTML / CSS
HTML5中实现拖放效果无须借助javascript
Dec 26 #HTML / CSS
html5 application cache遇到的严重问题
Dec 26 #HTML / CSS
You might like
实现分十页分向前十页向后十页的处理
2006/10/09 PHP
关于PHP模板Smarty的初级使用方法以及心得分享
2013/06/21 PHP
浅谈php中变量的数据类型判断函数
2017/03/04 PHP
浅谈PHP错误类型及屏蔽方法
2017/05/27 PHP
PHP+RabbitMQ实现消息队列的完整代码
2019/03/20 PHP
TP5框架实现一次选择多张图片并预览的方法示例
2020/04/04 PHP
JavaScript高级程序设计(第3版)学习笔记 概述
2012/10/11 Javascript
修改file按钮的默认样式实现代码
2013/04/23 Javascript
jq实现酷炫的鼠标经过图片翻滚效果
2014/03/12 Javascript
jquery使用正则表达式验证email地址的方法
2015/01/22 Javascript
javascript将DOM节点添加到文档的方法实例分析
2015/08/04 Javascript
JS实现跟随鼠标的链接文字提示框效果
2015/08/06 Javascript
非常酷炫的Bootstrap图片轮播动画
2016/05/27 Javascript
AngularJS Phonecat实例讲解
2016/11/21 Javascript
jQuery仿IOS弹出框插件
2017/02/18 Javascript
微信小程序实现手势图案锁屏功能
2018/01/30 Javascript
浅析Vue 和微信小程序的区别、比较
2018/08/03 Javascript
VUE UPLOAD 通过ACTION返回上传结果操作
2020/09/07 Javascript
vue使用exif获取图片旋转,压缩的示例代码
2020/12/11 Vue.js
python实现ftp客户端示例分享
2014/02/17 Python
Python实现备份文件实例
2014/09/16 Python
Python中if __name__ == &quot;__main__&quot;详细解释
2014/10/21 Python
python去除扩展名的实例讲解
2018/04/23 Python
matplotlib subplots 设置总图的标题方法
2018/05/25 Python
举例讲解Python常用模块
2019/03/08 Python
Pytorch之parameters的使用
2019/12/31 Python
Pycharm打开已有项目配置python环境的方法
2020/07/03 Python
python 下载m3u8视频的示例代码
2020/11/11 Python
python 元组和列表的区别
2020/12/30 Python
2015最新学生自我评价范文
2015/03/03 职场文书
单身证明范本
2015/06/15 职场文书
网吧温馨提示
2015/07/17 职场文书
2015年学校政教工作总结
2015/07/20 职场文书
校运会广播稿
2015/08/19 职场文书
Python 正则模块详情
2021/11/02 Python
Golang日志包的使用
2022/04/20 Golang