HTML5 拥有多个可供选取日期和时间的新输入类型:

  1. date-选取日、月、年
  2. month-选取月、年
  3. week-选取周和年
  4. time-选取时间(小时和分钟)
  5. datetime-选取时间、日、月、年(本地时间)
下面的例子允许我从日历中选一个日期:
eg:
Date:<niput type="date" name="user_date" />
  1. <!DOCTYPE html>
  2. <html>
  3. <head><title>xxxx</title>
  4. </head>
  5. <body>
  6. <form action="/example/html5/demo_form.asp" method="get">
  7. <input type="date" name="user_date" />
  8. <input type="submit" />
  9. </form>
  10. </body>
  11. </html>

效果如图:

假如

  1. type="date"

date换成输入的是month:

 
假如输入的是week:
假如输入的是time:
 
假如输入的是datetime:
 
假如是datetime-local:
 
datatime调不出日历控件原因:
调不出来是因为有些浏览器不支持datetime这种日历控件,比如chrome。
Datetime 对象是 HTML5 中的新对象。
Datetime 对象表示 HTML <input type="datetime"> 元素。
注释:Internet Explorer、Firefox 或者 Chrome 不支持 <input type="datetime"> 元素,Safari 中部分支持。Opera 12 以及更早的版本中完全支持。

HTML5表单之Input 类型- Date Pickers(日期选择器)的更多相关文章

  1. HTML5学习总结-05 HTML5表单

    一 HTML5 新的类型 HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证. email url number range Date pickers (date, month ...

  2. Html5学习进阶三 Input 类型

    HTML5 新的 Input 类型 HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证. 本章全面介绍这些新的输入类型: email url number range Date ...

  3. 服务器变量 超级全局数组$_SERVER (附加超简单表单与html5表单属性)

    001.html <html> <head><title>user log</title> <meta http-equiv="cont ...

  4. HTML5学习笔记之Input类型

    Input类型——email email类型用于包含email地址的输入域,在输入地址时会自动验证email域的值 例:Email:<input type="email" n ...

  5. HTML表单之input元素的23种type类型

    摘自:http://www.cnblogs.com/xiaohuochai/p/5179909.html 了解HTML表单之input元素的23种type类型 随着HTML5的出现,input元素新增 ...

  6. 使用MUI的日期控件引起的探索——HTML5 input类型date属性

    我写移动端的页面会用到MUI这个框架,个人觉得挺好用的,有很多实用的UI组件.当然坑还是有的,http://dev.dcloud.net.cn/mui/ui/ MUI官网,有兴趣的小伙伴可以看看 虽然 ...

  7. 了解HTML表单之input元素的30个元素属性

    目录 传统属性 name type accept alt checked disabled readonly maxlength size src value 新增属性 autocomplete au ...

  8. HTML5表单及其验证

    随笔- 15 文章- 1 评论- 115 HTML5表单及其验证   HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其A ...

  9. HTML5: HTML5 表单属性

    ylbtech-HTML5: HTML5 表单属性 1.返回顶部 1. HTML5 表单属性 HTML5 新的表单属性 HTML5 的 <form> 和 <input>标签添加 ...

随机推荐

  1. BZOJ Lydsy5月月赛 ADG题解

    题目链接 BZOJ5月月赛 题解 好弱啊QAQ只写出三题 A 判断多干个数乘积是否是某个数的倍数有很多方法,比较常用的是取模,但这里并不适用,因为模数不定 会发现数都比较小,所以我们可以考虑分解质因子 ...

  2. 【BZOJ 1998】[Hnoi2010]Fsk物品调度 置换群+并查集

    置换群的部分水得一比,据说是经典的置换群理论(然而我并不知道这理论是啥).重点就在于怎么求pos!!!容易发现这个东西是这样的:每次寻找pos,先在本环里找,找不到再往下一个环里找,直到找到为止……一 ...

  3. 第三方库安装——requests

    环境 操作系统:CentOS 6.7 32-bit Python:2.6.6 安装 pip install requests

  4. Linux环境下用Weblogic发布项目【一】 -- 安装Weblogic

     一.Weblogic安装系统环境: 1.前提条件: a.在笔记本[Windows7]上安装远程连接Linux软件:F-Secure SSH File Transfer Trial[简写为:FSSH] ...

  5. SpringMVC源码解析-DispatcherServlet启动流程和初始化

    在使用springmvc框架,会在web.xml文件配置一个DispatcherServlet,这正是web容器开始初始化,同时会在建立自己的上下文来持有SpringMVC的bean对象. 先从Dis ...

  6. js正则:两边字符固定,中间任意字符

    求些一个js正则!两边字符固定,中间任意字符.在一个长字符串里面匹配一小段,这一小段字符串开头和结尾都是固定的字符,就是中间是任意长度的字符.怎么写? /aa.+aa/ aa是你的固定字符,如果是反斜 ...

  7. bzoj 1189 [HNOI2007]紧急疏散evacuate 二分+网络流

    [HNOI2007]紧急疏散evacuate Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 3626  Solved: 1059[Submit][St ...

  8. 【BZOJ2287】消失之物 [分治][DP]

    消失之物 Time Limit: 10 Sec  Memory Limit: 128 MB[Submit][Status][Discuss] Description ftiasch 有 N 个物品, ...

  9. Java 扑克牌发牌

    今天看到这个算法题,http://www.cnblogs.com/xishuai/p/3392981.html ,忍不住自己用Java做了一个. 初始化很重要,所有的52张牌按顺序放入到容器里边,标志 ...

  10. error 0152: No Entity Framework provider found for the ADO.NET provider with invariant name 'System.Data.SqlClient'

    error 0152: No Entity Framework provider found for the ADO.NET provider with invariant name 'System. ...