原生js简单日期插件

所属分类:输入-日期和时间

 104536  437  查看评论 (50)
分享到微信朋友圈
X
原生js简单日期插件 ie兼容9

更新时间:2020-01-04 23:56:44

更新说明:

1、增加回到今日功能

2、增加禁用日期功能

3、增加默认选中功能

4、修复已知bug


更新时间:2018/12/29 11:59

更新说明:修改月数小于31天时显示bug。


配置参数:

var mySchedule = new Schedule({
    el: '#schedule-box', //指定包裹元素(可选)
    date: '2018-9-20', //生成指定日期日历(可选)
    clickCb: function(y, m, d) {
        //点击日期回调(可选)
    },
    nextMonthCb: function(y, m, d) {
        //点击下个月回调(可选)
    },
    nextYeayCb: function(y, m, d) {
        //点击下一年回调(可选)
    },
    prevMonthCb: function(y, m, d) {
        //点击上个月回调(可选)
    },
    prevYearCb: function(y, m, d) {
        //点击上一年月回调(可选)
    }
});

实例方法:

mySchedule.nextMonthFun(); //下一月
mySchedule.nextYearFun(); //下一年
mySchedule.nextMonthFun(); //上一月
mySchedule.prevYearFun(); //上一年
相关插件-日期和时间

移动端日期滚动选择插件mobisscroll3.0完整版

mobiscroll是个很好用的jQuery日期插件,它可以实现在移动端滚动选择日期。
  日期和时间
 40779  362

zepto移动端时间选择插件

简单的移动端时间选择,去掉年显示,适合线上预定下单
  日期和时间
 48281  352

优雅的日期选择插件daterangepicker

jQuery bootstrap日期选择插件daterangepicker,多种时间类型选择
  日期和时间
 73588  339

jQuery定时器自动版

可以定时1~60分钟,定时结束播放音乐
  日期和时间
 24807  273

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

    ???? 0
    2021/3/22 10:34:54
    在react中,组件中写入一个div,id为schedule-box的,然后写上楼主的js语句,然后报了Schedule的undefined,使用我是不是要引入什么问价
        ????0
        2021/3/22 10:35:25
        文件,打错字了,抱歉
    回复
    ???? 0
    2021/3/22 10:33:05
    请问我需要引入什么文件 回复
    LZW123456 0
    2020/2/21 10:36:14
    我用ajax传进去的标识日期,为什么每个月的一号都标识不上颜色,应该说标识上了,但一瞬间又被去掉了颜色,有哪位大佬遇见了吗,解决了不,
        LZW1234560
        2020/2/21 11:13:44
        已解决
    回复
    LZW123456 0
    2020/2/18 17:57:00
    nextMonthCb: function(y, m, d) {
    //自调用(可选)
    },
    我好想知道,这个点击事件放在ajax里面,之后点击调用ajax为什么会成倍数的请求
        LZW1234560
        2020/2/21 10:36:36
        解决了,
        心随云动云随风0
        2021/2/23 16:31:06
        请问怎样解决的
    回复
    Emer~ 0
    2020/1/21 17:18:49
    请问 如何 动态传入选定的日期
    我ajax 返回后 不能动态 传进去
        LZW1234561
        2020/2/18 17:14:19
        var seriousLibs = []
        
        function scheduleMsg(y, m) {
            $.ajax({
                url: 'http://192.168.2.55:8885/envAutoAir/monthAqi',
                typs: 'post',
                data: 'year=' + y + '&month=' + m,
                success: function(res) {
                    console.log(res);
                    seriousLibs.push(res.data)
                    var mySchedule = new Schedule({
                        el: '#schedule-box', //容器元素
                        // date: '2018-9', //生成指定日期日历(可选)
                        date: y + '-' + m, //当前日期	
                        // disabledBefore: '2018-07-10',	//禁用此日期之前
                        // disabledAfter: '2018-11-15',	//禁用此日期之后
                        // disabledDate: ['2018-8-20', '2018-8-2', '2018-8-23'], //禁用的日期
                        selectedDate: seriousLibs, //选中的日期
                    });
                }
                还想要其他标识的颜色就看他的js文件, 看黄色标识是怎么标识上去的, 如法炮制
            })
    回复
    大谷子 0
    2019/11/7 17:43:23
    回到今天这个功能,还是很有必要的,麻烦楼主考虑下。 回复
    雅痞 0
    2019/9/10 10:24:05
    我需要在日历上展示数据 怎么写啊
    回复
    不完美 0
    2019/8/30 9:50:15
    按照@いωǒ做你?唯━的说法,如果回到当初点击的那个月份时,时间显示是前面月份中天数少的那个数,但是按钮并不在显示的时间那个地方,比如点击8月31号,然后改变月份到二月,再点击月份回到八月,下面一行字显示的是日期:2019-8-28,但是日历表上的active状态在31号 回复
    selfimpr 0
    2019/4/28 9:26:16
    怎么点击日期获取对应的安排
    回复
    缉の熙 0
    2018/12/20 17:27:21
    如何标识传入多个显示日期
        某天怀念0
        2018/12/21 13:44:37
        兄弟解决call一下我 qq154808154
        静心听雨0
        2019/1/12 16:29:28
        你解决了没有阿
        houlili0
        2019/7/17 17:23:04
        解决了嘛
        进击的旺旺0
        2019/10/28 11:23:49
        同问 ,解决了吗
        LZW1234560
        2020/2/18 10:30:17
        这不是,看一下他代码就知道怎么写了吗。。。。
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复