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 相关文章推荐
收集的7个CSS3代码生成工具
Apr 17 HTML / CSS
css3与html5实现响应式导航菜单(导航栏)效果分享
Feb 12 HTML / CSS
利用css3实现的简单的鼠标悬停按钮
Nov 04 HTML / CSS
利用CSS3实现平移动画效果示例代码
Oct 12 HTML / CSS
css3实现椭圆轨迹旋转的示例代码
Oct 29 HTML / CSS
详解如何在css3打包后自动追加前缀插件:autoprefixer
Dec 18 HTML / CSS
css3遮罩层镂空效果的多种实现方法
May 11 HTML / CSS
如何使用localstorage代替cookie实现跨域共享数据问题
Apr 18 HTML / CSS
HTML5资源预加载(Link prefetch)详细介绍(给你的网页加速)
May 07 HTML / CSS
使用phonegap创建联系人的实现方法
Mar 30 HTML / CSS
Html5页面内使用JSON动画的实现
Jan 29 HTML / CSS
HTML5 body设置全屏背景图片的示例代码
Dec 08 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
虫族 ZERG 概述
2020/03/14 星际争霸
深入了解 register_globals (附register_globals=off 网站打不开的解决方法)
2012/06/27 PHP
PHP 通过Socket收发十六进制数据的实现代码
2013/08/16 PHP
启用Csrf后POST数据时出现的400错误
2015/07/05 PHP
学习YUI.Ext 第四天--对话框Dialog的使用
2007/03/10 Javascript
javascript 表单规则集合对象
2009/07/21 Javascript
JS中prototype关键字的功能介绍及使用示例
2013/07/21 Javascript
jQuery 隐藏和显示 input 默认值示例
2014/06/03 Javascript
javascript感应鼠标图片透明度显示的方法
2015/02/24 Javascript
你一定会收藏的Nodejs代码片段
2016/02/04 NodeJs
Javascript typeof与instanceof的区别
2016/10/18 Javascript
jsTree事件和交互以及插件plugins详解
2017/08/29 Javascript
JS实现的集合去重,交集,并集,差集功能示例
2018/03/13 Javascript
Electron中实现大文件上传和断点续传功能
2018/10/28 Javascript
vue实现微信获取用户信息的方法
2019/03/21 Javascript
vue引入微信sdk 实现分享朋友圈获取地理位置功能
2019/07/04 Javascript
Layui点击图片弹框预览的实现方法
2019/09/16 Javascript
vue跳转同一个组件,参数不同,页面接收值只接收一次的解决方法
2019/11/05 Javascript
vue excel上传预览和table内容下载到excel文件中
2019/12/10 Javascript
leaflet加载geojson叠加显示功能代码
2020/02/21 Javascript
解决vue安装less报错Failed to compile with 1 errors的问题
2020/10/22 Javascript
wxpython中自定义事件的实现与使用方法分析
2016/07/21 Python
Python编程django实现同一个ip十分钟内只能注册一次
2017/11/03 Python
python搭建服务器实现两个Android客户端间收发消息
2018/04/12 Python
Pyinstaller打包.py生成.exe的方法和报错总结
2019/04/02 Python
python过滤中英文标点符号的实例代码
2019/07/15 Python
Python matplotlib以日期为x轴作图代码实例
2019/11/22 Python
街头时尚在线:JESSICABUURMAN
2019/06/16 全球购物
自荐书模板
2013/12/15 职场文书
妈妈的账单教学反思
2014/02/06 职场文书
户外活动策划方案
2014/03/12 职场文书
仓管员岗位职责范本
2015/04/01 职场文书
餐厅收银员岗位职责
2015/04/07 职场文书
优质服务心得体会(共4篇)
2016/01/22 职场文书
Nginx反向代理配置的全过程记录
2021/06/22 Servers
Debian11 Xfce终端光标的颜色怎么设置?
2022/08/14 数码科技