如何使用類型範圍的輸入值來設置jQuery UI滑塊的值？

Question

我使用jQuery UI滑塊作爲HTML5輸入類型=範圍的後備。最初，我想使用input-element中的值來設置jQuery UI Slider的值，但這似乎不起作用。輸入元素的值設置爲50，但是當創建滑塊時，它的值爲100.如果我使用value: 50而不是value: $input.attr('value')，它可以正常工作。 min: $input.attr('min')和max: $input.attr('max')工作得很好。

這裏是我的代碼：

$(document).ready(function(){ 

    sliderFallback(); 

}); 


function sliderFallback(){ 
    $('input[type=range]').each(function() { 
     var $input = $(this); 
     var $slider = $('<div id="' + $input.attr('id') + '" class="' + $input.attr('class') + '"></div>'); 


     $slider.slider({ 
      min: $input.attr('min'), 
      max: $input.attr('max'), 
      value: $input.attr('value'),  
      slide: function(e, ui) { 
       $(this).val(ui.value); 
      } 
     }); 
     $input.after($slider).hide(); 
    }); 
} 

Answer 1

試試這個：

 function sliderFallback(){ 
      $('input[type=range]').each(function() { 
       var $input = $(this); 
       var $slider = $('<div id="' + $input.attr('id') + '" class="' + $input.attr('class') + '"></div>'); 

       var val = parseInt($(this).val()); 

       $slider.slider({ 
        min: $input.attr('min'), 
        max: $input.attr('max'), 
        value: val,  
        slide: function(e, ui) { 
         $(this).val(ui.value); 
        } 
       }); 
       $input.after($slider).hide(); 
      }); 
     }