使用Bootstrap Datepicker選擇月份日期範圍和月份

Question

如何使用Bootstrap Datepicker選擇月份日期和月份範圍？

我目前使用jQuery UI datepicker來選擇月份和星期。

這裏是我嘗試在月內進行轉換的星期日期範圍的示例。但得到的問題

這裏是鏈接，JS小提琴https://jsfiddle.net/prtk/znbx32j1/1/

HTML

<div class="form-group col-md-8 col-md-offset-2" id="week-picker-wrapper"> 
    <label for="week" class="control-label">Select Week</label> 
    <div class="input-group"> 
     <span class="input-group-btn"> 
      <button type="button" class="btn btn-rm week-prev">&laquo;</button> 
     </span> 
     <input type="text" class="form-control week-picker" placeholder="Select a Week"> 
     <span class="input-group-btn"> 
      <button type="button" class="btn btn-rm week-next">&raquo;</button> 
     </span> 
    </div> 
</div> 

JS

var weekpicker, start_date, end_date; 

function set_week_picker(date) { 
    start_date = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay()); 
    end_date = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6); 
    weekpicker.datepicker('update', start_date); 
    weekpicker.val((start_date.getMonth() + 1) + '/' + start_date.getDate() + '/' + start_date.getFullYear() + ' - ' + (end_date.getMonth() + 1) + '/' + end_date.getDate() + '/' + end_date.getFullYear()); 
} 
$(document).ready(function() { 
    weekpicker = $('.week-picker'); 
    console.log(weekpicker); 
    weekpicker.datepicker({ 
     autoclose: true, 
     forceParse: false, 
     container: '#week-picker-wrapper', 
    }).on("changeDate", function(e) { 
     set_week_picker(e.date); 
    }); 
    $('.week-prev').on('click', function() { 
     var prev = new Date(start_date.getTime()); 
     prev.setDate(prev.getDate() - 1); 
     set_week_picker(prev); 
    }); 
    $('.week-next').on('click', function() { 
     var next = new Date(end_date.getTime()); 
     next.setDate(next.getDate() + 1); 
     set_week_picker(next); 
    }); 
    set_week_picker(new Date); 
}); 

Answer 1

您需要修改click事件prev和next計算。檢查this fiddle（檢查控制檯以查看值）。

使用setMonth()和getMonth()而不是setDate()和getDate()。此外，您可能需要調整/設置Day值以獲得準確的結果。

更新：這是updated fiddle