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五个技巧给你的网站带来出色的效果
Apr 02 HTML / CSS
纯css3实现效果超级炫的checkbox复选框和radio单选框
Sep 01 HTML / CSS
CSS3中各种颜色属性的使用教程
May 17 HTML / CSS
CSS3实现歌词进度文字颜色填充变化动态效果的思路详解
Jun 02 HTML / CSS
详解CSS3媒体查询响应式布局bootstrap 框架原理实战(推荐)
Nov 16 HTML / CSS
HTML5自定义data-* data(obj)属性和jquery的data()方法的使用
Dec 13 HTML / CSS
html5-Canvas可以在web中绘制各种图形
Dec 26 HTML / CSS
HTML5 Canvas draw方法制作动画效果示例
Jul 11 HTML / CSS
HTML5 Canvas锯齿图代码实例
Apr 10 HTML / CSS
HTML页面滚动时部分内容位置固定不滚动的实现
Apr 14 HTML / CSS
CSS3实现指纹特效代码
Mar 17 HTML / CSS
css之clearfix的用法深入理解(必看篇)
May 21 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
ThinkPHP实现ajax仿官网搜索功能实例
2014/12/02 PHP
在Linux系统下一键重新安装WordPress的脚本示例
2015/06/30 PHP
PHP中COOKIES使用示例
2015/07/26 PHP
windows8.1下Apache+Php+MySQL配置步骤
2015/10/30 PHP
jquery tab插件精简版分享
2011/09/10 Javascript
javasciprt下jquery函数$.post执行无响应的解决方法
2014/03/13 Javascript
详解JavaScript中的blink()方法的使用
2015/06/08 Javascript
JS动态创建DOM元素的方法
2015/06/09 Javascript
JavaScript兼容性总结之获取非行间样式案例
2016/08/07 Javascript
Bootstrap菜单按钮及导航实例解析
2016/09/09 Javascript
Bootstrap字体图标无法正常显示的解决方法
2016/10/08 Javascript
微信小程序 登录的简单实现
2017/04/19 Javascript
vue.js路由跳转详解
2017/08/28 Javascript
使用use注册Vue全局组件和全局指令的方法
2018/03/08 Javascript
重学 JS:为啥 await 不能用在 forEach 中详解
2019/04/15 Javascript
vue+AI智能机器人回复功能实现
2020/07/16 Javascript
python+opencv识别图片中的圆形
2020/03/25 Python
python中while和for的区别总结
2019/06/28 Python
pytorch 常用函数 max ,eq说明
2020/06/28 Python
windows系统Tensorflow2.x简单安装记录(图文)
2021/01/18 Python
使用css3绘制出各种几何图形
2016/08/17 HTML / CSS
全球酒店预订网站:Hotels.com
2016/08/10 全球购物
印度手工编织服装和家居用品商店:Fabindi
2019/10/07 全球购物
Farah官方网站:男士服装及配件
2019/11/01 全球购物
美容师的职业规划书
2013/12/27 职场文书
和平主题的演讲稿
2014/01/12 职场文书
恐龙的灭绝教学反思
2014/02/12 职场文书
学习优秀共产党员先进事迹思想报告
2014/09/17 职场文书
反腐倡廉剖析材料
2014/09/30 职场文书
学习三严三实心得体会
2014/10/13 职场文书
考试作弊万能检讨书
2014/10/19 职场文书
2019新员工试用期转正申请书3篇
2019/08/13 职场文书
多表查询、事务、DCL
2021/04/05 MySQL
如何使JavaScript休眠或等待
2021/04/27 Javascript
golang 在windows中设置环境变量的操作
2021/04/29 Golang
windows server2016安装oracle 11g的图文教程
2022/07/15 Servers