UI | 输入 | 媒体 | 导航 | 其他 | 网页模板| APP模板| 常用代码| 在线代码

移动端网页轻量级日期控件LCalenda

所属分类：输入-选择框

 106360  388  查看评论 (67)
分享到微信朋友圈
X
移动端网页轻量级日期控件LCalenda ie兼容10
 查看演示  website  立即下载

注：请在移动端查看效果。

LCalendar

纯原生js的移动端日期插件，不依赖任何库，体积非常小只有10k

用法

在html页面中引入input标签，通过自定义属性data-lcalendar控制最小日期和最大日期，写法如下：

...
<input type="text" readonly="" name="input_date" placeholder="请输入日期" data-lcalendar="2000-01-01,2018-01-29" />
...

将样式文件引入到页面中：

...
<link rel="stylesheet" href="LCalendar.css">
...

同时引入js文件到页面中：

...
<script src="LCalendar.js"></script>
...

初始化插件：

...
var calendar = new LCalendar();
calendar.init({
    'trigger': '#demo1',//标签id
    'type': 'date',//date 调出日期选择 datetime 调出日期时间选择 time 调出时间选择 ym 调出年月选择
    'minDate':'1900-1-1',//最小日期 注意：该值会覆盖标签内定义的日期范围
    'maxDate':'2016-3-18'//最大日期 注意：该值会覆盖标签内定义的日期范围
});
...
相关插件-选择框
查看更多

自制小清新select插件

 通过原生生成美化后的，分享给初学者
  选择框
 38765  385

jquery 省市区三级联动选择（原创）

 省市区三级联动选择，可以任意改造样式
  选择框
 28119  319

双向选择表格（支持IE8及以上）

 双向选择表格，支持自定义查询条件（支持下拉框）、自定义表头和数据格式（表格支持链接）、单选全选、选择事件、动态修改数据等功能，具体可以查看示例
  选择框
 18737  197

手机端省市县三级联动

 jQuery手机端省市县联动
  选择框
 31684  343

讨论这个项目（67）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    天下有道，我黼子佩 0
    2021/7/13 17:40:20

    点击遮罩层实现关闭功能我给作者补上了，如果谁需要可以找我，原理其实很简单，就是把作者所有的事件都租阻止冒泡并且写了一个关闭事件。

    回复
    hupc 0
    2020/7/2 11:02:36
    这个可以支持年月日时分秒吗，我看type是datetime时，只能支持到年月日时分，不能支持秒 回复
    丿Sorry丶 0
    2020/3/31 19:42:13
    当传入最小日期为月底最后一天时就会出现直接到12月分份的问题 回复
    幸运的虫虫 0
    2019/9/24 10:29:01
    怎么监听确定按钮呢？ 回复
    。 0
    2019/6/12 17:32:18
    LCalendar.js:594 Uncaught TypeError: Cannot read property 'querySelector' of null
    at LCalendar.js:594
(anonymous)@LCalendar.js:594
setInterval (async)
rollGear@LCalendar.js:567
gearTouchEnd@LCalendar.js:554

    选择日期的时候会报这个错。。。  然后旁边有个小红框 一直刷新数字  越来越大   就我自己有这个问题吗？

    var date_yy = _self.gearDate.querySelector(".date_yy");
target["int_" + target.id] = setInterval(function() {
rollGear(target);

     报错行数  

        风芥0
        2019/10/21 9:22:22
        我也遇到同样的问题，而且有时候报错的行数不同，请问解决了吗
    回复
    Shirley_CN 0
    2019/4/2 9:24:33
    问个问题，我改了传入的时间数据，现在是动态生成的，但是int初始化在ajax里面每次调用就重复出现多个时间控件，能有什么办法移除么
        错过了三生三世0
        2019/6/28 17:32:17
        解决了么。同问
    回复
    |.逍遥ギ¤沉默∮ 0
    2019/3/30 9:24:55
    设置默认值，点击取消和确定的回调函数呢？怎么设置 回复
    zqilong 0
    2018/12/10 14:00:54
    怎么更改分钟的值啊，我想让它间隔5分钟 并不像这样每一分钟都显示得 有解决办法么 回复
    这个年纪 0
    2018/10/11 9:50:54
    填入开始时间不会显示在开始时间框里 会显示在结束时间框里 有什么办法解决吗
        tournesol0
        2018/11/7 14:28:11
        同问，请问您解决了吗。现在我遇到这个问题
    回复
    WFuChengGeGe 0
    2018/9/7 10:18:01
    能设置分钟30分钟一个节点的吗 回复
查看更多评论
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
取消回复