javascript - 防止鼠标滑出后ionRangeSlider更改值

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

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

如何预防这种行为？

代码很简单：

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

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

最佳答案

首先，将ionRangeSlider分配给一个变量，读取docs

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

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

一次，您可以将鼠标从主容器中移出，使dragging: false

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

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