带有时刻js的无效日期答案

【问题标题】：Invalid Date with moment js带有时刻js的无效日期
【发布时间】：2016-10-28 11:51:20
【问题描述】：

考虑到这一点 http://jsfiddle.net/2a0hsj4z/4/，这里是sn-p：

moment.locale("en");

var start = moment("2010-10", "YYYY-MM");
var end = moment("2017-10", "YYYY-MM");

$("#chord_range").ionRangeSlider({
    type: "double",
    grid: true,
    min: start.format("x"),
    max: end.format("x"),
    from: start.format("x"),
    to: end.format("x"),
    prettify: function (num) {
        return moment(num, 'x').format("MMMM YYYY");
    }
});

var slider = $("#chord_range").data("ionRangeSlider");

$(".irs-slider").click(function() {
	console.log(slider.result.from);
})

<link href="http://ionden.com/a/plugins/ion.rangeSlider/static/css/skin2.css" rel="stylesheet"/>
<link href="http://ionden.com/a/plugins/ion.rangeSlider/static/css/ion.rangeSlider.css" rel="stylesheet"/>
<input id="chord_range" />
<script src="http://code.jquery.com/jquery-1.11.0.js"></script>
<script src="http://ionden.com/a/plugins/ion.rangeSlider/static/js/ion-rangeSlider/ion.rangeSlider.js"></script>
<script src="http://momentjs.com/downloads/moment.min.js"></script>

当我尝试拖动左/右滑块（开始/结束值）时，为什么会得到 Invalid Date error？启动时日期显示正确。当您触摸滑块时，它会中断。当我用 var start = moment("2012-10", "YYYY-MM"); 替换 var start = moment("2010-10", "YYYY-MM"); 时，它可以工作：

moment.locale("en");

var start = moment("2012-10", "YYYY-MM");
var end = moment("2017-10", "YYYY-MM");

$("#chord_range").ionRangeSlider({
    type: "double",
    grid: true,
    min: start.format("x"),
    max: end.format("x"),
    from: start.format("x"),
    to: end.format("x"),
    prettify: function (num) {
        return moment(num, 'x').format("MMMM YYYY");
    }
});

var slider = $("#chord_range").data("ionRangeSlider");

$(".irs-slider").click(function() {
	console.log(slider.result.from);
})

<link href="http://ionden.com/a/plugins/ion.rangeSlider/static/css/skin2.css" rel="stylesheet"/>
<link href="http://ionden.com/a/plugins/ion.rangeSlider/static/css/ion.rangeSlider.css" rel="stylesheet"/>
<input id="chord_range" />
<script src="http://code.jquery.com/jquery-1.11.0.js"></script>
<script src="http://ionden.com/a/plugins/ion.rangeSlider/static/js/ion-rangeSlider/ion.rangeSlider.js"></script>
<script src="http://momentjs.com/downloads/moment.min.js"></script>

这是为什么呢？

【问题讨论】：

我将您的 jsFiddle 内容复制到问题中的 sn-p 中。我不知道你在做什么，但它可以正常工作并很好地复制问题。
@T.J.Crowder 我复制并粘贴了HTML 和JS 并添加了外部库（链接在jsfiddle 链接中的库）。那没有运行 - 它给了我一个错误。
“一个错误”不是很有用的信息。无论如何，再一次，我已经为你做到了。（我所做的只是复制和粘贴。）祝你好运。
@T.J.Crowder 谢谢 :)

标签： javascript jquery date slider momentjs

【解决方案1】：

你错过了 step 选项，step 将是 1，1 对于 (option.max - option.min) 来说太小了，会导致 ion rangeSlider 出错。所以你应该设置一个很大的数字用于步骤选项。

$("#chord_range").ionRangeSlider({
    type: "double",
    grid: true,
    min: start.format("x"),
    max: end.format("x"),
    from: start.format("x"),
    to: end.format("x"),
    step: 100000,
    prettify: function (num) {
      return moment(num, 'x').format("MMMM YYYY");
    }
});

【讨论】：

但为什么它适用于高于2010的日期？
对不起我的英语不好。简而言之，。在离子量程滑块中，有一个变量“this.coords.p_step”。它的计算方式是“(step * 100 / (options.max - options.min)).toFixed(9)”。当 step 太小或 options.max - options.min 太大时。 p_step 为 0，会报错。