1

noUiSLider の wNumb.js プラグインを使用して、複数のスライダーの入力を米ドルとして表示するようにフォーマットしようとしています。基本フォーマット オブジェクトは最初の入力に対して機能しますが、2 番目の入力と、スライダーを持つ他のすべての入力は空として表示されます。また、ブラウザーは 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 に答える