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. 38 一次 redis 连接泄露的原因 以及 ShardedJedisPool

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u011039332/article/details/85381051前言 这个是接着 上次的 这篇文 ...

  2. BZOJ2597 [Wc2007]剪刀石头布 【费用流】

    题目链接 BZOJ2597 题解 orz思维差 既然是一张竞赛图,我们选出任意三个点都可能成环 总方案数为 \[{n \choose 3}\] 如果三个点不成环,会发现它们的度数是确定的,入度分别为\ ...

  3. JavaScript倒计时脚本

    JavaScript倒计时在Web中用得非常广泛,比如常见的团购啊.还有什么值得期待的事情,都可以用到倒计时.现在举了四个例子,比如时间长的倒计时,小时倒计时,最简的倒计时,还有秒表等等,应该可以满足 ...

  4. node.js 与java 的主要的区别是什么

    node.js 与java都是服务器语言,但是两者存在很大区别:(1)Node.js比Java更快 :node.js开发快,运行的效率也算比较高,但是如果项目大了就容易乱,而且javascript不是 ...

  5. java访问Https服务的客户端示例

    关于证书 1.每个人都可以使用一些证书生成工具为自己的https站点生成证书(比如JDK的keytool),大家称它为“自签名证书”,但是自己生成的证书是不被浏览器承认的,所以浏览器会报安全提示,要求 ...

  6. mybatis中parameterType可以写的别名

    mybatis中parameterType可以写的别名 https://blog.csdn.net/sdzhangshulong/article/details/51749807 _byte byte ...

  7. CSS知识之 background-size 用法详细介绍

    background-size是CSS3新增的比较实用的属性,使用它可以随心所欲地控制背景图的显示大小,而在css2中背景图的大小是不可控制的. 基本语法: 用于设置背景图片的大小,有2个可选值,第1 ...

  8. sql cmd命令执行sqlserver的sql文件

    有的时候,我们通过Log Explorer工具根据日志生成的回滚脚本,或者其他情况我们得到的脚本文件,通过sqlserver打开脚本文件的方式不爽,我们可以这样: 方式一: osql -S . -U ...

  9. webservice 针对WebService服务，客户端调用时报序列化的最大项数maxItemsInObjectGraph超过65536问题

    今天在使用webservice服务时候,报异常“The InnerException message was 'Maximum number of items that can be serializ ...

  10. ECMAScript5中新增的Array方法实例详解

    ECMAScript5标准发布于2009年12月3日,它带来了一些新的,改善现有的Array数组操作的方法.(注意兼容性) 在ES5中,一共有9个Array方法:http://kangax.githu ...