美文网首页
2015年10月12日

2015年10月12日

作者: KurokoZ | 来源:发表于2015-10-12 22:30 被阅读54次
    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


    假装工作,其实自拍

    相关文章

      网友评论

          本文标题:2015年10月12日

          本文链接:https://www.haomeiwen.com/subject/kpdocttx.html