Question

滑块可以并且应该通过以下方式更改：拖动，点击，输入一个数字并通过按+/-。

除了拖动之外，所有工作都很好：当我释放手柄时，它会向拖动方向再“跳”一步。例如，如果我从1500拖到2000，它将在2010年发布时停止。如果我取出change: refreshCalculation它没有那样做，但当然它不允许+/-和手动号码插入。

请检查：http://jsfiddle.net/YvsmT/

$("#slider-vertical").slider({
orientation: "horizontal",
range: "min",
animate: 500,
min: 0,
max: 8760,
value: 1500,
step: 10,
slide: refreshCalculation,
change: refreshCalculation
});

function refreshCalculation() {
var s4 = $("#slider-vertical").slider("value");
$("#betriebsstunden").val(s4);
}

$("#plus1").click(function () {
var bs1 = $("#slider-vertical").slider("value");
$("#slider-vertical").slider("value", bs1 + 10);
refreshCalculation();
});

$("#minus1").click(function () {
var bs1 = $("#slider-vertical").slider("value");
$("#slider-vertical").slider("value", bs1 - 10);
refreshCalculation();
});

$("#betriebsstunden").change(function () {
var value = this.value;
$("#slider-vertical").slider("value", value);
});


refreshCalculation();

Answer 1

你必须删除change: refreshCalculation并且它工作正常。

$("#slider-vertical").slider({
    orientation: "horizontal",
    range: "min",
    animate: 500,
    min: 0,
    max: 8760,
    value: 1500,
    step: 10,
    //change: refreshCalculation,
    slide: refreshCalculation
});

function refreshCalculation() {
    var s4 = $("#slider-vertical").slider("value");
    $("#betriebsstunden").val(s4);
}

$("#plus1").click(function () {
    var bs1 = $("#slider-vertical").slider("value");
    $("#slider-vertical").slider("value", bs1 + 10);
    refreshCalculation();
});

$("#minus1").click(function () {
    var bs1 = $("#slider-vertical").slider("value");
    $("#slider-vertical").slider("value", bs1 - 10);
    refreshCalculation();
});

$("#betriebsstunden").change(function () {
    var value = this.value;
    $("#slider-vertical").slider("value", value);
});


refreshCalculation();

演示：http://jsfiddle.net/YvsmT/1/

JqueryUI滑块：拖动后它仍然“跳”一步

1 个答案: