我的 slider 的 min
值为 2012 年 1 月 1 日
,max
值为 2018 年 12 月 31 日
。
当我移动 min
日期 slider 时,由于某种原因,max
日期值会重置为 2018 年 11 月 23 日
。
我认为这与这里的舍入问题类似>>> Jquery UI Slider incorrect max value但我不知道如何解决日期的舍入问题。
我记录了一堆 console.log
来查看 max
日期在哪里重置。基本上,一旦单击 slider ,jQuery slider 就会设置 min
和 max
值。我尝试在 slider API 的引擎盖下查看但这并没有多大帮助。我什至尝试了其他一些 Events
来查看它们的 ui.values
返回的内容,但无济于事。他们都将最大
日期(错误地)重置为2018年11月23日
。
底线:如何更改代码以使幻灯片 max
日期反射(reflect)实际 slider ?
代码:
$("#slider").slider({
range: true,
min: new Date("1/1/2012").getTime(),
max: new Date("12/31/2018").getTime(),
step: new Date("4/1/2010").getTime() - new Date("1/1/2010").getTime(),
values: [new Date("1/1/2012").getTime(), new Date("12/31/2018").getTime()],
slide: function(event, ui) {
// console.log(new Date("12/31/2018").getTime());
// console.log(ui.values);
sliderBegDate = new Date(ui.values[0]);
sliderEndDate = new Date(ui.values[1]);
$("#dateLabel1").text("From " + formatTime(new Date(ui.values[0])));
$("#dateLabel2").text(" to " + formatTime(new Date(ui.values[1])));
updateCharts();
}
});
最佳答案
问题似乎出在您的 step
值上 - 目前您一次前进 3 个月,这并不能平均划分为您的 min - max
范围,因此它会调整您的 max
以适应 step
您可以更改您的最大值
以适应,或者找到适合您的步数
- 在此演示中,我设置了步数
到 4 天,这有效
$("#slider").slider({
range: true,
min: new Date("1/1/2012").getTime(),
max: new Date("12/31/2018").getTime(),
step: 345600000,
values: [new Date("1/1/2012").getTime(), new Date("12/31/2018").getTime()],
slide: function(event, ui) {
sliderBegDate = new Date(ui.values[0]);
sliderEndDate = new Date(ui.values[1]);
$("#dateLabel1").text("From " + new Date(ui.values[0]));
$("#dateLabel2").text(" to " + new Date(ui.values[1]));
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js"></script>
<div id="slider"></div>
<div id="dateLabel1">Demo</div>
<div id="dateLabel2">Demo</div>
关于javascript - jQuery slider 设置不正确的 ui.values,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59913132/