2014-10-03 3 views
1

noUiSLider 용 wNumb.js 플러그인을 사용하여 여러 슬라이더에서 입력을 미국 달러로 표시하도록 형식을 지정하려고합니다. 기본 형식 개체는 첫 번째 입력에서는 작동하지만 두 번째 입력과 슬라이더가있는 다른 모든 입력은 비어있는 것으로 표시됩니다. 또한 브라우저에서 JavaScript 오류가 발생하지 않습니다. wNumb 문서에noUiSlider - wNumb 포맷 만 첫 번째 슬라이더

링크 : http://refreshless.com/wnumb/ 링크 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

+0

코드를 업데이트했습니다. 더 많은 컨텍스트를 제공합니다. – user1646145

+0

@ Lg102는 해당 상황에 맞는 도움말을 제공합니까? 더 많은 것을 제공하길 원하십니까? – user1646145

답변

0

이 문제는 아주 간단했다 : 여기 http://refreshless.com/nouislider/

은 기본 noUiSlider 코드입니다. 내가 가지고있는 첫 번째 입력은 'type = text'입니다. 이 때문에 '$', '.'등의 문자열 데이터로 쉽게 형식을 지정할 수 있습니다. noUislider 형식의 비효율을 초래 한 'type = number'가 포함 된 다음 입력 모두.