带加号和减号的jQuery滑块值

从各种堆栈溢出问题中，我已经设法将我的滑块移动到我想要的位置，例如，一个带有加号和减号的滑块

我的问题是，如果我想显示更多次输出，拖动滑块可以很好地工作，但是如果我使用加号和减号，它会落后一位数

HTML

<div class="container">
    <div id="minus1" class="minus"><span>-</span></div>
    <div id="plus1" class="plus">+</div>
    <p>
        <input type="text" id="amount_money" style="border:0; color:#ff0000; font-weight:bold;" disabled>
    </p>
    <div id="slider_1"></div>
    <div class="test">0</div>
    <div class="test">0</div>
</div>

---

创建了一个fiddle-

问题是因为您的

weightSliderValue

根据触发的事件进行了不同的修改。遵循的一种更简单的模式是直接从滑块读取值，并且不需要全局变量

您还可以稍微整理一下逻辑，以便

changeValue（）

执行所有事件下的所有更新。试试这个：

function changeValue() {
    var value = '£' + addCommas($('#slider_1').addClass('red').slider("option", "value"));
    $(".test").html(value);
    $("#amount_money").val(value);
}

$("#slider_1").slider({
    range: "min",
    min: 0,
    max: 300000,
    step: 50000,
    animate: true,
    create: changeValue,
    change: changeValue,
    slide: changeValue
});

---

嗨，Rory，我回家后会试试这个，谢谢你回来找我。嗨，Rory，非常感谢上面的内容，非常棒，也学到了一些东西，所以干杯：）

function changeValue() {
    var value = '£' + addCommas($('#slider_1').addClass('red').slider("option", "value"));
    $(".test").html(value);
    $("#amount_money").val(value);
}

$("#slider_1").slider({
    range: "min",
    min: 0,
    max: 300000,
    step: 50000,
    animate: true,
    create: changeValue,
    change: changeValue,
    slide: changeValue
});