HTML5新控件之日期和时间选择输入的实现代码


Posted in HTML / CSS onSeptember 13, 2018

HTML5定义了几个与日期有关的新控件。支持日期控件的浏览器会提供一个方便的下拉式日历,供用户选择。

 注意:目前只有Chrome和Opera提供下拉式日历支持,其它浏览器仍是一个普通文本框。

1,日期控件 - date

HTML5新控件之日期和时间选择输入的实现代码

<input type="date" value="2015-09-24"/>

2,时间控件 - time

HTML5新控件之日期和时间选择输入的实现代码

<input type="time" value="13:59"/>
<input type="time" value="13:59:59"/>

3,日期时间控件 - datetime-local

HTML5新控件之日期和时间选择输入的实现代码

<input type="datetime-local" value="2015-09-24T13:59:59"/>

4,月控件 - month

HTML5新控件之日期和时间选择输入的实现代码

<input type="month" value="2015-09"/>

5,周控件 - week

HTML5新控件之日期和时间选择输入的实现代码

<input type="week" value="2015-W02"/>

6,日期时间控件也支持min和max属性,表示可设置的最小和最大时间

HTML5新控件之日期和时间选择输入的实现代码

<input type="date" value="2015-09-24" min="2015-09-16" max="2015-09-26"/>

总结

以上所述是小编给大家介绍的HTML5新控件之日期和时间选择输入,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

HTML / CSS 相关文章推荐
CSS3动画之利用requestAnimationFrame触发重新播放功能
Sep 11 HTML / CSS
CSS3教程(10):CSS3 HSL声明设置颜色
Apr 02 HTML / CSS
网页切图的CSS和布局经验与要点
Apr 09 HTML / CSS
CSS3哪些新特性值得称赞
Mar 02 HTML / CSS
简单掌握CSS3中resize属性的用法
Apr 01 HTML / CSS
什么是CSS3 HSLA色彩模式?HSLA模拟渐变色条
Apr 26 HTML / CSS
图解CSS3制作圆环形进度条的实例教程
May 26 HTML / CSS
css3实现背景模糊的三种方式(小结)
May 15 HTML / CSS
HTML5 Canvas阴影使用方法实例演示
Aug 02 HTML / CSS
分享全球十款超强HTML5开发工具
May 14 HTML / CSS
Canvas与图片压缩的示例代码
Nov 28 HTML / CSS
利用html+css实现菜单栏缓慢下拉效果的示例代码
Mar 30 HTML / CSS
Html5中的桌面通知Notification的实现
Sep 25 #HTML / CSS
详解canvas drawImage()方法绘制图片不显示的问题
Oct 08 #HTML / CSS
HTML5 和小程序实现拍照图片旋转、压缩和上传功能
Oct 08 #HTML / CSS
传统HTML页面实现模块化加载的方法
Oct 15 #HTML / CSS
html5/css3响应式页面开发总结
Oct 16 #HTML / CSS
教你如何一步一步用Canvas写一个贪吃蛇
Oct 22 #HTML / CSS
HTML高亮关键字的实现代码
Oct 22 #HTML / CSS
You might like
php框架Phpbean说明
2008/01/10 PHP
php join函数应用
2011/05/04 PHP
利用浏览器的Javascript控制台调试PHP程序
2014/01/08 PHP
jquery中实现简单的tabs插件功能的代码
2011/03/02 Javascript
jQuery UI AutoComplete 使用说明
2011/06/20 Javascript
分析Node.js connect ECONNREFUSED错误
2013/04/09 Javascript
Javascript浅谈之this
2013/12/17 Javascript
深入探讨JavaScript、JQuery屏蔽网页鼠标右键菜单及禁止选择复制
2014/06/10 Javascript
javascript面向对象之对象的深入理解
2015/01/13 Javascript
JS实现在页面随时自定义背景颜色的方法
2015/02/27 Javascript
JS仿Base.js实现的继承示例
2017/04/07 Javascript
JS匿名函数和匿名自执行函数概念与用法分析
2018/03/16 Javascript
nodejs+mongodb aggregate级联查询操作示例
2018/03/17 NodeJs
js取小数点后两位四种方法
2019/01/18 Javascript
jQuery实现图片随机切换、抽奖功能(实例代码)
2019/10/23 jQuery
vue+element UI实现树形表格
2020/12/29 Vue.js
[04:52]第二届DOTA2亚洲邀请赛主赛事第一天比赛集锦:OG娜迦海妖放大配合谜团大中3人
2017/04/02 DOTA
[01:31:03]DOTA2完美盛典全回顾 见证十五项大奖花落谁家
2017/11/28 DOTA
python定时检查启动某个exe程序适合检测exe是否挂了
2013/01/21 Python
Python简单计算文件夹大小的方法
2015/07/14 Python
基于Python的XSS测试工具XSStrike使用方法
2017/07/29 Python
pycharm中使用anaconda部署python环境的方法步骤
2018/12/19 Python
python celery分布式任务队列的使用详解
2019/07/08 Python
opencv python图像梯度实例详解
2020/02/04 Python
美国在线家居装饰店:Belle&June
2018/10/24 全球购物
沙特阿拉伯排名第一的在线时尚购物应用程序:1Zillion
2020/08/08 全球购物
中专自我鉴定范文
2013/10/16 职场文书
行政助理岗位职责范文
2013/12/03 职场文书
小学学雷锋活动总结
2014/04/25 职场文书
世博会口号
2014/06/20 职场文书
简单租房协议书
2014/10/21 职场文书
综合测评个人总结
2015/03/03 职场文书
2015年计生协会工作总结
2015/04/24 职场文书
迎新年主持词
2015/07/06 职场文书
公司宣传语大全
2015/07/13 职场文书
研讨会致辞
2015/07/31 职场文书