JQuery UI 滑块设置多个输入值

Question

我试图在滑动 JQuery UI 滑块时更改多个值。基本上根据滑块的编号更改 3 个不同的值。在这种情况下，我使用的范围是 100,000 美元到 2,000,000 美元。然后我想根据滑块的位置计算 3 个不同的值。
对于第一个值，我想获得 6% - (2.7%+ $2799)。第二个值为 6% - 5299 美元。第三个值是 6% - $3799 这是我目前所拥有的：

<div id="slider">
<div id="slider-min">0,000</div>
<div id="slider-max">,000,000</div>
</div>
<input id="amount" readonly type="text">
<div class="options-wrap">
<input id="result1" readonly type="text">
<input id="result2" readonly type="text">
<input id="result3" readonly type="text">
</div>

JS

$(function() {
$( "#slider" ).slider({
  range: 'min',
  value: 100000,
  min: 100000,
  max: 2000000,
slide: function( event, ui ) {
   $( "#amount" ).val( "$" + addCommas(ui.value.toString()));
  }
});
$('#amount')
.val( "$" + addCommas($("#slider").slider("value")));
///  Need to add a function(s) that would change the values of
///  the following selectors $('#result1'),$('result2') and $('result3')
///  based on the position of the slider with the calculation stated above.
function addCommas(nStr)
{
nStr += '';
x = nStr.split('.');
x1 = x[0];
x2 = x.length > 1 ? '.' + x[1] : '';
var rgx = /(\d+)(\d{3})/;
while (rgx.test(x1)) {
    x1 = x1.replace(rgx, '' + ',' + '');
}
return x1 + x2;
}
});

我尝试了不同的方法来在滑动滑块时改变这 3 个值，但令人沮丧的是，我每次尝试都失败了。我得承认我不是专家，我非常尊重那些在这个领域有更好知识的人。任何帮助将不胜感激。

Answer 1

JQUERY:

$(function () {
$("#slider").slider({
    range: 'min',
    value: 100000,
    min: 100000,
    max: 2000000,
    slide: function (event, ui) {
        $("#amount").val("$" + addCommas(ui.value));
        $("#result1").val("$" + addCommas(Math.round(ui.value*.06 - (.027+ 2799))));
        $("#result2").val("$" + addCommas(Math.round(ui.value*.06 -5299)));
        $("#result3").val("$" + addCommas(Math.round(ui.value*.06 -3799)));
    }
});
$('#amount')
    .val("$" + addCommas($("#slider").slider("value")));
///  Need to add a function(s) that would change the values of
///  the following selectors $('#result1'),$('result2') and $('result3')
///  based on the position of the slider with the calculation stated above.
function addCommas(nStr) {
    nStr += '';
    x = nStr.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '' + ',' + '');
    }
    return x1 + x2;
}

});

研究：http://jsfiddle.net/eqnLc9fg/1/

JQuery UI 滑块设置多个输入值

JQuery UI slider setting multiple input values

jquery

jquery-ui

input

slider