daterangepicker的个性化使用技巧

由于该模板不自动将时间戳添加到input中去，始终为NaN，所以，自己选取起始时间与截止时间

　　var startTime =new Date(new Date().toLocaleDateString()).getTime()/1000;
　　var endTime = new Date(new Date().toLocaleDateString()).getTime()/1000+(24 * 60 * 60) - 1;

datelist = {}  //自己创建或者从后台获取 格式为 （yyyy-MM-dd）
//日历
    $('.date-picker').daterangepicker({
        showDropdowns:true,
　　　　　　 timePicker: true,   //显示时钟
　　　　　　 maxDate: moment(new Date()),   //设置最大可选日期
        isCustomDate:function( date ) { //看需求是否需要对样式进行修改
            for(var i=0;i<datelist.length;i++){
                if(date.format('YYYY-MM-DD') == datelist[i]){
                    return "in-range";    //有数据的返回浅蓝颜色  active为深蓝
                }
            }
            return "disabled";  //没有数据不可选 自己不想也可以return false
        },
      //用来设置默认时间显示格式,各个按钮空间的中文显示
        locale: {
           format:'YYYY/MM/DD',
           applyLabel:'确认',
           cancelLabel:'取消',
           fromLabel:'从',
           toLabel:'到',
           weekLabel:'W',
           customRangeLabel:'选择时间',
           daysOfWeek:["日","一","二","三","四","五","六"],
           monthNames: ["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十 一月","十二月"] 
            }
    }, function(start, end, label) {
        startTime=start.unix();
        endTime = end.unix();
         });

我主要进行对日期数据进行查看使用，有数据的显示颜色、没有数据可以不选

更多可以查看官方网站：http://www.daterangepicker.com/#examples

    里面需要用的是哪个包下载下来引入就行了
<link rel="stylesheet" href="daterangepicker.css" />
    <script src="/moment.min.js"></script>
    <script src="daterangepicker.js"></script> 

 ps:关注一下本人公众号，每周都有新更新哦！