2015年10月12日

mark

今天和公司的前端一起研究页面,有点心得,标记下新学的技能:

引出:优化新插件的页面,表单页面需要调用时间插件,使用户可以输入年月日,使用了几款外部插件,效果均不理想

HTML5调用手机的Datepicker(日期选择器)

再一次感受到了HTML5的强大之处,本来很复杂的一个万年历插件,用HTML5来实现只需要一行代码!

  • HTML5中新的input类型:
    email,url,number,range,** Datepicker **,search,color

  • HTML5中的datepicker拥有多种可供选取日期和时间的新输入类型:
    1.date - 选取年、月、日
    2.month - 选取月、年
    3.week - 选取周、年
    4.time - 选取小时、分钟
    5.datetime - 选取时间、日、月、年(UTC时间)
    6.datetime-local - 选取时间、日、月、年(本地时间)

例如:<input type = "month" />将显示年月选择器
在chrome上浏览的效果:


chrome浏览器的效果

在在iPhone5s、iOS7上的效果:


iPhone上的的效果

本来几十行代码,调用好几个文件才能实现的效果,HTML5一个input标签就搞定了,真心屌!

最后附一张加班自拍图o( ̄▽ ̄)o


假装工作,其实自拍
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 阅读时间:2015年10月12日晚上 22:00-22:25 阅读书目:《快速阅读》托尼-巴赞 阅读页码:27-3...
    不要多愁善感阅读 1,265评论 0 1
  • 上午跟妈妈去看她的兼职,对是她想找点事挣点钱。到了地方晕车什么也听不进去了,好吧!我来。 所谓做一个月的账竟然是从...
    a2f7386efc10阅读 1,319评论 0 1
  • 阅读时间:2015年10月12日晚上 22:00-22:25 阅读书目:《快速阅读》托尼-巴赞 阅读页码:27-3...
    不要多愁善感阅读 1,468评论 0 1
  • 那天我和老公一起站在爸妈在小镇上经营的摊位前,很长一段时间谁也没有说话,一对刚下班的夫妻坐在路边一张简陋的小桌上,...
    Zoey1022阅读 2,915评论 0 1
  • 1、网站的可访问性 正确做法 搜索框网页中设置搜索框,并保证功能到位 内链适当的网站内链建设不止有利于用户的浏览,...
    电游女王阅读 1,657评论 0 1

友情链接更多精彩内容