日历范围 本月（限年）

用日期插件时，经常会有一种需求。两个input框选择。开始时间小于结束时间，结束时间大于开始时间，开始时间和结束时间都不大于当前时间。

然后当一个输入框日期变化（包括清除）的时候，changeDate事件触发，在其回调函数里修改另一个输入框的可选范围

    function DatePicker(beginSelector,endSelector){  
              // 仅选择日期  
              $(beginSelector).datepicker(  
              {  
                language:  "zh-CN",  
                autoclose: true,  
                startView: 0,  
                format: "yyyy-mm-dd",  
                clearBtn:true,  
                todayBtn:false,  
                endDate:new Date()  
              }).on('changeDate', function(ev){               
                if(ev.date){  
                    $(endSelector).datepicker('setStartDate', new Date(ev.date.valueOf()))  
                }else{  
                    $(endSelector).datepicker('setStartDate',null);  
                }  
              })  
      
              $(endSelector).datepicker(  
              {  
                language:  "zh-CN",  
                autoclose: true,  
                startView:0,  
                format: "yyyy-mm-dd",  
                clearBtn:true,  
                todayBtn:false,  
                endDate:new Date()  
              }).on('changeDate', function(ev){    
                if(ev.date){  
                    $(beginSelector).datepicker('setEndDate', new Date(ev.date.valueOf()))  
                }else{  
                    $(beginSelector).datepicker('setEndDate',new Date());  
                }   
      
              })  
          }  
      
          DatePicker("#date_begin","#date_end");  

Bootstrap DatePicker实现日期选择 开始日期不大于结束时间，结束时间不小于开始时间，开始日期和结束日期都不大于当前日期。

演示地址：http://runningls.com/demos/2016/daily/datepicker/

github:https://github.com/liusaint/JavaScript-record/tree/master/datepicker

转载注明出处：http://blog.csdn.net/liusaint1992/article/details/52590681

以上是我百度出来和自己项目需求差不说的

但是我的项目需求可能更小一点  就是在开始时间里 选择的年 月  ，在结束时间里也是这个年份 和月份并且 不能够选择其他月份

并且出现了一些问题，在我把写好的放入我们项目中发现 ，日历总是出现在左侧 ，不在文本况下  ，经过自己调啊，终于发现原来是某个css里少了个position:absolute

.datepicker {
    background-color: #fff;
    border-radius: 4px;
    direction: ltr;
    position: absolute;//新添加的
}

 

//日期范围 控制开始
//日历
function DatePicker(beginSelector, endSelector) {
    // 开始时间
    $(beginSelector).datepicker(
    {
        language: "zh-CN",
        autoclose: true,
        startView: 0,
        format: "yyyy-mm-dd",
        clearBtn: true,
        todayBtn: false,
        todayHighlight: true,
        endDate: new Date()
    }).on('changeDate', function (ev) {
        $(endSelector).datepicker('setDate', '');
        if (ev.date) {
            $(endSelector).datepicker('setStartDate', new Date(ev.date.valueOf()));
            $(endSelector).datepicker('setEndDate', AddDays($(beginSelector).datepicker('getDate'), issueDays($(beginSelector).datepicker('getDate'))));
        } else {
            $(endSelector).datepicker('setStartDate', null);
        }

    })
    //结束时间
    $(endSelector).datepicker(
    {
        language: "zh-CN",
        autoclose: true,
        startView: 0,
        format: "yyyy-mm-dd",
        clearBtn: true,
        todayBtn: false,
        pickerPosition: "bottom-right",
        todayHighlight: true,
        endDate: new Date()
    }).on('changeDate', function (ev) {
        if (ev.date) {
            $(beginSelector).datepicker('setEndDate', new Date(ev.date.valueOf()))
        } else {
            $(beginSelector).datepicker('setEndDate', new Date());
        }
    })
}



//获取某月剩余天数
function issueDays(now) {
    var today = now;
    var now = today.getDate();
    var year = today.getYear();
    if (year < 2000) year += 1900; // Y2K fix
    var month = today.getMonth();
    var monarr = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
    if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0)) monarr[1] = "29";
    return (monarr[month] - now);

}

//日期加上天数后的新日期.
function AddDays(date, days) {
    var nd = new Date(date);
    nd = nd.valueOf();
    nd = nd + days * 24 * 60 * 60 * 1000;
    nd = new Date(nd);
    var y = nd.getFullYear();
    var m = nd.getMonth() + 1;
    var d = nd.getDate();
    if (m <= 9) m = "0" + m;
    if (d <= 9) d = "0" + d;
    var cdate = y + "-" + m + "-" + d;
    return cdate;
}

//select
timeShi();
function timeShi() {
    var arr = ['0时', '1时', '2时', '3时', '4时', '5时', '6时', '7时', '8时', '9时', '10时', '11时', '12时', '13时',
    '14时', '15时', '16时', '17时', '18时', '19时', '20时', '21时', '22时', '23时'];
    for (var i = 0; i < arr.length; i++) {
        if (i == 0) {
            var html = "<option value='" + arr[i] + "' selected='selected'>" + arr[i] + "</option>";
        }
        else {
            var html = "<option value='" + arr[i] + "'>" + arr[i] + "</option>";

        }
        $(".selectS").each(function () {
            $(this).append(html)
        })
    }
}
DatePicker("#date_begin", "#date_end"）

//还没有添加注释