Question

我有下一个jsfiddle：

https://jsfiddle.net/alonshmiel/vxz7fnvk/1/

有一个带有椭圆的滑块，其中包含箭头。

我想编写一个函数，当用户更改值时，该函数会显示一个带有椭圆值的弹出窗口。

但是：滚动它有两个选项：

1）当您点击某个值时，屏幕上会显示一个带有该值的弹出窗口。

2）当你点击椭圆并向左或向右移动，然后停止点击椭圆（换句话说，停止滚动它）时，带有值的弹出窗口将显示在屏幕上值。

$("#slider").slider({
    value:30,
    min: 0,
    max: 100,
    step: 10,
    slide: function( event, ui ) {
        $( "#slider a" ).html("<span class='Triangles'>&#9664;&#9654;</span>");
        $( "#slider-value" ).html(ui.value);            
    }
});

任何帮助表示赞赏！

Answer 1

您想要绑定到stop事件。当用户停止拖动或滑块上不同点的点击时，它将触发。

这是您更新的代码：

$("#slider").slider({
    value: 30,
    min: 0,
    max: 100,
    step: 10,
    slide: function (event, ui) {
        $("#slider a").html("<span class='Triangles'>&#9664;&#9654;</span>");
        $("#slider-value").html(ui.value);
    },
    stop: function (event, ui) {
        alert(ui.value);
    }
});

工作小提琴：https://jsfiddle.net/vxz7fnvk/3/

弹出窗口，当它更改时，滑块的值

1 个答案: