1

使用 noUiSLider 的 wNumb.js 插件，我试图将多个滑块上的输入格式化为美元。基本格式对象适用于第一个输入，但第二个输入和所有其他具有滑块的输入显示为空。此外，浏览器不会抛出任何 JavaScript 错误。

wNumb 文档链接：http ://refreshless.com/wnumb/ noUiSlider 文档链接： http ://refreshless.com/nouislider/

这是基本的 noUiSlider 代码：

var slider_sales_vol = $('.range-slider-sales-vol'),
    slider_sales_vol_mas = $('.range-slider-sales-vol-mas'),
    AnnualVisaSales = $('#AnnualVisaSales'), guard = false,
    AnnualMasterCardSales = $('#AnnualMasterCardSales'), guard = false;

function setSalesValue(value){
    if ( guard ) return;
    $(this).val(value);
}

AnnualVisaSales.change(function(){
    var value = $(this).val();
    guard = true;
    slider_sales_vol.val(value);
    guard = false;
});

AnnualMasterCardSales.change(function(){
    var value = $(this).val();
    guard = true;
    slider_sales_vol_mas.val(value);
    guard = false;
});

var range_all_sliders = {
    'min': [ 1000, 1000 ],
    '33%': [ 100000,  50000 ],
    '66%': [ 500000, 100000 ],
    'max': [ 1000000 ]
};

$('.range-slider-sales-vol').noUiSlider({
    start: [ 1000 ],
    range: range_all_sliders,
    format: wNumb({
        decimals: 0,
        thousand: ',',
        prefix: '$ '
    })      
});

$('.range-slider-sales-vol-mas').noUiSlider({
    start: [ 1000 ],
    range: range_all_sliders,
    format: wNumb({
        decimals: 0,
        thousand: ',',
        prefix: '$ '
    })     
});

$('.range-slider-sales-vol').Link("lower").to(AnnualVisaSales, setSalesValue);
$('.range-slider-sales-vol-mas').Link("lower").to(AnnualMasterCardSales, setSalesValue);
4

1 回答 1

0

问题很简单。我的第一个输入是'type = text'。正因为如此，它可以很容易地用'$'、'.'等字符串数据进行格式化......所有以下输入中的'type=number'都会导致noUislider格式化无效。

于 2014-10-15T14:00:34.810 回答