【问题标题】:Bootstrap datetimepicker with left & right arrow带有左右箭头的引导日期时间选择器
【发布时间】:2016-12-30 06:18:50
【问题描述】:

我想要如下图所示的引导日期时间选择器,

点击左箭头会更改前一天的日期,点击下一个箭头会显示第二天的日期。

提前致谢。

【问题讨论】:

  • 请提供一个最小示例或展示您尝试过的内容。阅读mcve
  • 我刚刚添加了引导日期选择器。我想要的是当用户单击左箭头时,日期字段应与前一天的日期更改,并且与第二天的右箭头相同。

标签: javascript jquery datepicker bootstrap-datetimepicker


【解决方案1】:

所以您正在使用带有引导设计的 jquery 日期选择器。如果我没记错的话,因为你没有提供任何源代码。 如果您使用 jquery 的日期选择器,您可以轻松调整下一个和上一个日期:

HTML

<button id="prev">prev</button>
<input type="text" id="datepicker"/>
<button id="next">next</button>

Jquery 代码:

$( "#datepicker" ).datepicker();

$("#prev").click(function(){
    var date = $('#datepicker').datepicker('getDate', '-1d'); 
    date.setDate(date.getDate()-1); 
    $('#datepicker').datepicker('setDate', date);
})


$("#next").click(function(){
        var date = $('#datepicker').datepicker('getDate', '+1d'); 
    date.setDate(date.getDate()+1); 
    $('#datepicker').datepicker('setDate', date);
})

JSFIDDLE https://jsfiddle.net/noitse/r1s0bwm6/

【讨论】:

    猜你喜欢
    • 2016-11-29
    • 2011-12-20
    • 2023-04-04
    • 2017-02-23
    • 1970-01-01
    • 2013-05-09
    • 1970-01-01
    • 2017-08-29
    • 1970-01-01
    相关资源
    最近更新 更多