jq仿苹果的时间/日期选择效果
1.html文件,index.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <!DOCTYPE html> <html lang= "en" > <head> <meta charset= "UTF-8" > <title>Title</title> <script src= "./jquery-1.12.4.min.js" ></script> <script src= "./pickDater.js" ></script> <style> body{position: absolute;width: 100%;height: 100%} ul{list-style: none;margin: 0} </style> </head> <body> <input id= "pickDater" style= "font-size: 50px;" > </body> </html> |
查看效果时候把浏览器调成手机模式
2.插件 链接地址:https://files.cnblogs.com/files/jiebba/pickDater.js ,
引用插件
3.调用插件
1.调用 日期
1 2 3 4 5 6 7 | var opt={ startY:1990, //开始时间 endY:2050, //结束事件 mPickerType:1, separator: '/' //日期分割符 } $( '#pickDater' ).mPickDater(opt); |
2.调用 时间
1 2 3 4 5 6 7 | var opt={ startY:1990, //开始时间 endY:2050, //结束事件 mPickerType:2, separator: '/' //日期分割符 } $( '#pickDater' ).mPickDater(opt); |
3.调用 日期和时间
1 2 3 4 5 6 7 | var opt={ startY:1990, //开始时间 endY:2050, //结束事件 mPickerType:3, separator: '/' //日期分割符 } $( '#pickDater' ).mPickDater(opt); |
代码仅供参考,具体功能可以自己扩展。
个人博客 :很多好用的 npm 包 , 可以看看 https://gilea.cn/
http://www.cnblogs.com/jiebba 我的博客,来看吧!
github: https://github.com/longfei59418888/vui (很不错的vue2.0组件库,记得给一个 start,以后有一起讨论,各种好组件)
感觉可以就推荐下吧!!
感觉可以就推荐下吧!!
感觉可以就推荐下吧!!
感觉可以就推荐下吧!!
感觉可以就推荐下吧!!
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步