2014-10-03 101 views
1

對於noUiSLider使用wNumb.js插件,我嘗試將多個滑塊上的輸入格式化爲美元。基本格式對象適用於第一個輸入,但第二個輸入和所有其他具有滑塊的輸入顯示爲空。另外,瀏覽器不會拋出任何JavaScript錯誤。noUiSlider - wNumb僅格式化第一個滑塊

鏈接到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); 
+0

您可以添加您用於在輸入中顯示值的代碼嗎? – Lg102 2014-10-03 19:37:02

+0

我更新了代碼,希望能夠提供更多的上下文。 – user1646145 2014-10-03 20:15:35

+0

@ Lg102是否有幫助?你想讓我提供更多嗎? – user1646145 2014-10-15 13:12:22

回答

0

的問題是很簡單的。我有的第一個輸入是'type = text'。正因爲如此,它可以很容易地用'$','。'等字符串數據進行格式化。所有以下輸入,其中'type = number'導致noUislider格式無效。