防止ionRangeSlider在鼠标移出后改变值

Question

在此 JSFiddle 中，按住鼠标键并拖动到 JSFiddle 结果 iframe 之外。

然后松开按钮。将鼠标移到滑块上。然后，将更改滑块值，而无需按住按钮。

如何防止这种行为？

代码非常简单：

var $range = $(".js-range-slider");

$range.ionRangeSlider({
    type: "double",
    min: 100,
    max: 1000,
    from: 300,
    to: 800
});

Answer 1

首先，将ionRangeSlider赋值给一个变量，读取docs

var slider = $(".js-range-slider").data("ionRangeSlider");

因此，滑块对象具有 属性 dragging: true

一次，您可以从主容器中 mouseout，使 dragging: false

var slider = $(".js-range-slider").data("ionRangeSlider");

$(".range-slider").mouseleave(function(){
  slider.dragging = false;
});

检查jsfiddle