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 相关文章推荐
详解CSS样式中的 !important * _ 符号
Mar 09 HTML / CSS
CSS3 不定高宽垂直水平居中的几种方式
Mar 26 HTML / CSS
纯CSS3实现移动端展开和收起效果的示例代码
Apr 26 HTML / CSS
HTML5 progress和meter控件_动力节点Java学院整理
Jul 06 HTML / CSS
html5新增的属性和废除的属性简要概述
Feb 20 HTML / CSS
html5 跨文档消息传输示例探讨
Apr 01 HTML / CSS
HTML5有哪些新特征
Dec 01 HTML / CSS
基于HTML5 WebGL的3D机房的示例
Mar 16 HTML / CSS
Canvas多边形绘制的实现方法
Aug 05 HTML / CSS
使用canvas生成含有微信头像的邀请海报没有微信头像问题
Oct 29 HTML / CSS
用canvas显示验证码的实现
Apr 10 HTML / CSS
CSS 使用 resize 实现图片拖拽切换预览功能(强大功能)
Aug 23 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下安装配置fckeditor编辑器的方法
2011/03/02 PHP
PHP投票系统防刷票判断流程分析
2012/02/04 PHP
PHP 输出URL的快捷方式示例代码
2013/09/22 PHP
PHP使用GIFEncoder类生成gif动态滚动字幕
2014/07/01 PHP
详解php curl带有csrf-token验证模拟提交方法
2018/04/18 PHP
laravel与thinkphp之间的区别与优缺点
2021/03/02 PHP
jquery+json 通用三级联动下拉列表
2010/04/19 Javascript
简单的jquery拖拽排序效果实现代码
2011/09/20 Javascript
文件编码导致jquery失效的解决方法
2013/06/26 Javascript
jquery中交替点击事件的实现代码
2014/02/14 Javascript
嵌入式iframe子页面与父页面js通信的方法
2015/01/20 Javascript
JavaScript中使用Math.floor()方法对数字取整
2015/06/15 Javascript
浅谈Koa服务限流方法实践
2017/10/23 Javascript
webpack之devtool详解
2018/02/10 Javascript
Vue Promise的axios请求封装详解
2018/08/13 Javascript
详解vue移动端项目的适配(以mint-ui为例)
2018/08/17 Javascript
node实现socket链接与GPRS进行通信的方法
2019/05/20 Javascript
JavaScript字符串处理常见操作方法小结
2019/11/15 Javascript
详细探究Python中的字典容器
2015/04/14 Python
Python解析json之ValueError: Expecting property name enclosed in double quotes: line 1 column 2(char 1)
2017/07/06 Python
python 实现语音聊天机器人的示例代码
2018/12/02 Python
使用Python做定时任务及时了解互联网动态
2019/05/15 Python
如何不用安装python就能在.NET里调用Python库
2019/07/12 Python
Django 对IP访问频率进行限制的例子
2019/08/30 Python
Python属性和内建属性实例解析
2020/01/14 Python
带你学习Python如何实现回归树模型
2020/07/16 Python
俄罗斯化妆品和香水网上商店:Iledebeaute
2019/01/03 全球购物
美国珠宝精品店:Opulent Jewelers
2019/08/20 全球购物
北京振戎融通Java面试题
2015/09/03 面试题
债务授权委托书范本
2014/10/17 职场文书
房屋租房协议书范本
2014/12/04 职场文书
2014年科室工作总结范文
2014/12/19 职场文书
后勤工作个人总结
2015/02/28 职场文书
公司催款律师函
2015/05/27 职场文书
2016年寒假政治学习心得体会
2015/10/09 职场文书
Vue.js 带下拉选项的输入框(Textbox with Dropdown)组件
2021/04/17 Vue.js