使用 Bootstsrap Jquery 在 datepicker 中将下个月和上个月替换为下一个和前一天答案

【问题标题】：Replace Next and Previous Month by Next And previous Day in datepicker using Bootstsrap Jquery使用 Bootstsrap Jquery 在 datepicker 中将下个月和上个月替换为下一个和前一天
【发布时间】：2021-05-14 04:00:21
【问题描述】：

我有一个 jquery bootstrap datepicker inline，我想增加和减少当天我试试这个：

// Html Code
<div id="datepicker"></div> 

// JS Code
$('#datepicker').datepicker({
    todayHighlight: true,
    language: 'en', 
 });
$('.btn-next').on("click", function () {
    var currentDate = $('#datepicker').datepicker('getDate');
    var selectedDate= new Date(currentDate);
    // Increase current day by +1
    selectedDate.setDate(selectedDate.getDate() + 1);
    $('#datepicker').datepicker('update',selectedDate);
});

$('.btn-prev').on("click", function () {
    var currentDate = $('#datepicker').datepicker('getDate');
    var selectedDate= new Date(currentDate);
    // Decrease current day by -1
    selectedDate.setDate(selectedDate.getDate() - 1);
    $('#datepicker').datepicker('update',selectedDate);
});

但它不再起作用了，这个运算符的任何想法

【问题讨论】：

你能显示你的html代码吗？以及你如何初始化你的日期选择器
@Frenchy 我修改了帖子
你的输入，你正在使用引导日期选择器？提供一个完整的带有按钮的示例，这样人们可以帮助您提供一个真实的示例

标签： javascript jquery twitter-bootstrap bootstrap-4 twitter-bootstrap-3

【解决方案1】：

您不需要再次转换从 datepicker 获得的日期，只需将 +1 或 -1 转换为它并在 datepicker 中添加新值。

演示代码：

$('#datepicker').datepicker({
  todayHighlight: true,
  language: 'en',
});
$('.btn-next').on("click", function() {
  var currentDate = $('#datepicker').datepicker('getDate');
  currentDate.setDate(currentDate.getDate() + 1);
  $('#datepicker').datepicker('update', currentDate);
});

$('.btn-prev').on("click", function() {
  var currentDate = $('#datepicker').datepicker('getDate');
  currentDate.setDate(currentDate.getDate() - 1);
  $('#datepicker').datepicker('update', currentDate);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js" integrity="sha256-bqVeqGdJ7h/lYPq6xrPv/YGzMEb6dNxlfiTUHSgRCp8=" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css" integrity="sha256-siyOpF/pBWUPgIcQi17TLBkjvNgNQArcmwJB8YvkAgg=" crossorigin="anonymous" />


<input type="text" id="datepicker">
<button class="btn-prev">Prev</button>
<button class="btn-next">Next</button>

【讨论】：