javascript - 防止 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 分配给一个变量，阅读文档

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;
});

检查jsfiddle