SelectDate

功能描述

本插件是基于jquery手写开发的日历开始结束选择工具，规避掉现有原生插件的切换月份所造成的适配问题， 产出背景：原生插件以及百度可以搜到的日历插件都不能满足需求，顾自己手写了一个。

依赖的插件

无

快速使用

直接针对页面调用功能

//code

相关html 结构

    <div id="rili"></div>

主要css样式

    无

关键js接口

    <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="js/c.js"></script>
    <script>
        b.openZDdiy({
            width: 300,//整个控件宽度
            itemheight: 40,//每行日期的高度
            daytextsize: 16,//日期的文字大小
            id: "rili",//设置的布局
            selectimg: 'img/zmcselect.png',//选中的背景图
            leftimg: 'img/zmcleft.png',//上个月背景图
            rightimg: 'img/zmcright.png',//下个月背景图
            mainbac: '#FAFFF9',//整体背景色
            titlebac: '#FDE102',//头部背景色
            selectcolor: '#fff',//选中之后的文字的颜色
            noselectcolor: '#000',//正常背景颜色
            nousecolor: '#999',//不可用颜色
            isfromtoday: true,//当天之前的是否不可以点击
            datelong: 7,//最长可以选择几天
            startime: '2019-07-29',//默认选中的开始时间
            stoptime: '2019-08-01',//默认选中的结束时间
            daterange: function(timearray, start, stop){
                console.log(JSON.stringify(timearray) + "==" + start + "==" + stop);//如果超过了7天的话 返回的都是false
            }
        });
    </script>

特别说明

  1. 在页面中定义一个div并赋值id为 rili。
  2. 其他所有参数均在方法中进行配置
  3. 联系信息：zd_logbug@163.com
是否仍需要帮助？ 请保持联络！
最后更新于 2024/04/24