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 相关文章推荐
你应该知道的30个css选择器
Mar 19 HTML / CSS
css3实现可拖动的魔方3d效果
May 07 HTML / CSS
CSS3 实现飘动的云朵动画
Dec 01 HTML / CSS
html5 Canvas画图教程(11)—使用lineTo/arc/bezierCurveTo画椭圆形
Jan 09 HTML / CSS
HTML5之SVG 2D入门11—用户交互性(动画)介绍及应用
Jan 30 HTML / CSS
Application Cache未缓存文件无法访问无法加载问题
May 31 HTML / CSS
html5使用Drag事件编辑器拖拽上传图片的示例代码
Aug 22 HTML / CSS
详解Html5 监听拦截Android返回键方法
Apr 18 HTML / CSS
canvas探照灯效果的示例代码
Nov 30 HTML / CSS
html2 canvas生成清晰的图片实现打印功能
Sep 23 HTML / CSS
Canvas环形饼图与手势控制的实现代码
Nov 08 HTML / CSS
css常用字体属性与背景属性介绍
Feb 28 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
基于Linux调试工具strace与gdb的常用命令总结
2013/06/03 PHP
php页面防重复提交方法总结
2013/11/25 PHP
标准版Eclipse搭建PHP环境的详细步骤
2015/11/18 PHP
匹配任意字符的正则表达式写法
2010/04/29 Javascript
修复ie8&amp;chrome下window的resize事件多次执行
2011/10/20 Javascript
Js 时间函数getYear()的使用问题探讨
2013/04/01 Javascript
javascript如何动态加载表格与动态添加表格行
2013/11/27 Javascript
Node.js中的流(Stream)介绍
2015/03/30 Javascript
轻松学习jQuery插件EasyUI EasyUI创建菜单与按钮
2015/11/30 Javascript
jquery html动态添加的元素绑定事件详解
2016/05/24 Javascript
Angularjs结合Bootstrap制作的一个TODO List
2016/08/18 Javascript
jQuery实现可拖拽3D万花筒旋转特效
2017/01/03 Javascript
微信小程序 弹框和模态框实现代码
2017/03/10 Javascript
用纯Node.JS弹出Windows系统消息提示框实例(MessageBox)
2017/05/17 Javascript
jquery-file-upload 文件上传带进度条效果
2017/11/21 jQuery
JavaScript折半查找(二分查找)算法原理与实现方法示例
2018/08/06 Javascript
超轻量级的js时间库miment使用解析
2019/08/02 Javascript
原生js滑动轮播封装
2020/07/31 Javascript
Python实现的ini文件操作类分享
2014/11/20 Python
wxpython中Textctrl回车事件无效的解决方法
2016/07/21 Python
Python绘制的二项分布概率图示例
2018/08/22 Python
python发送告警邮件脚本
2018/09/17 Python
Python语法分析之字符串格式化
2019/06/13 Python
python+rsync精确同步指定格式文件
2019/08/29 Python
Django框架HttpResponse对象用法实例分析
2019/11/01 Python
python 爬取百度文库并下载(免费文章限定)
2020/12/04 Python
什么是典型的软件三层结构?软件设计为什么要分层?软件分层有什么好处?
2012/03/14 面试题
实现strstr功能,即在父串中寻找子串首次出现的位置
2016/08/05 面试题
《中华少年》教学反思
2014/02/15 职场文书
合作协议书怎么写
2014/04/18 职场文书
县级领导干部开展党的群众路线教育实践活动工作汇报
2014/10/25 职场文书
2014年减负工作总结
2014/12/10 职场文书
三行辞职书范文
2015/02/26 职场文书
田径运动会通讯稿
2015/07/18 职场文书
java设计模式--建造者模式详解
2021/07/21 Java/Android
Java 关于String字符串原理上的问题
2022/04/07 Java/Android