如何使用类型范围输入的值来设置jQuery UI Slider的值

How can I use the value from an input of type range to set the value of a jQuery UI Slider?

本文关键字：jQuery 设置 UI Slider 的值 类型 何使用 范围 输入      更新时间：2023-09-26

我使用jQuery UI Slider作为HTML5输入type=range的后备。最初，我想使用input元素中的值来设置jQueryUISlider的值，但这似乎不起作用。输入元素的值设置为50，但创建滑块时，其值为100。如果我使用value: 50而不是value: $input.attr('value')，效果会很好。CCD_ 3和CCD_。

这是我的代码：

$(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();
    }); 
}

试试这个：

      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();
          }); 
      }
相关文章：