Question

我正在使用jQuery Slider插件（jqueryui.com/demos/slider /）

我正在使用以下Javascript调用该插件：

$(function(){
 $("#slider-price").slider({
 range: true,
 min: 0,
 max: 5000000,
 step: 100000,
 values: [0, 5000000],
 slide: function(event, ui) {       
 $("#amount").val('£' + ui.values[0] + ' - £' + ui.values[1]);
}
});
});

使用标记打印到页面上：

<label for="amount">Price : </label>
<input class="bar-price" type="text" id="amount" />
<div id="slider-price"></div>

当然上面的Javascript会在“金额”输入框中打印“£0 - £5000000”之类的内容。

我一直在寻找扩展Javascript的方法，以便用千位分隔符格式化数字（即“£0 - 5,000,000”）。我发现了几个可以执行此操作的Javascript函数，但我似乎无法在jQuery函数块中调用它们。

例如，这个函数是完美的http://www.mredkj.com/javascript/nfbasic.html但是我似乎无法在将数字打印到输入框字符串之前引用它。

我确信必须有一个简单的解决方案。

Answer 1

试试这个......

slide: function(event, ui) {       
 $("#amount").val('£' + addCommas(ui.values[0]) + ' - £' + addCommas(ui.values[1]));
}



//.....


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, '$1' + ',' + '$2');
    }
    return x1 + x2;
}

Answer 2

function commafy(val) {
    return String(val).split("").reverse().join("")
                      .replace(/(.{3}\B)/g, "$1,")
                      .split("").reverse().join("");
}

来自：http://twitter.com/ded/status/13621796430

用法：

commafy(5000000); // => 5,000,000

添加千位分隔符以从jQuery Slider插件输出

2 个答案: