如何从jQuery UI滑块获取价值？

Question

我正在http://gamercity.info/ymusic/上工作。 我正在使用UI滑块作为搜索栏。 播放视频时，如果用户单击搜索栏上的任意位置，我想调用seekTo(seconds)函数。 点击事件后如何获取seconds新值？

Answer 1

要随时读取滑块值/百分比值：

var val = $('#slider').slider("option", "value");

Answer 2

$('#slider').slider({
    change: function(event, ui) { 
        alert(ui.value); 
    } 
});​

http://jqueryui.com/demos/slider/

Answer 3

var val = $("#slider").slider("value");

Answer 4

我检查了上面提到的所有答案，但发现以下代码没有用：

$('#slider').slider("values")[0]; // for slider with single knob or lower value of range
$('#slider').slider("values")[1]; // for highest value of range

经jQuery v2.1.1和jQuery-ui v1.12.1测试

Answer 5

$("#slider").slider(
{
            value:100,
            min: 0,
            max: 500,
            step: 50,
            slide: function( event, ui ) {
                $( "#slider-value" ).html( ui.value );
            }
}
);

JS范例： http : //jsfiddle.net/hiteshbhilai2010/5TTm4/1162/

你可以有这样的功能

function seekTo(seek_value)
{
$("#slider").slider('option', 'value',seek_value);

}

Answer 6

  // Price Slider
        if ($('.price-slider').length > 0) {
            $('.price-slider').slider({
                min: 0,
                max: 2000,
                step: 10,
                value: [0, 2000],
                handle: "square",


            });
        }



$(document).ready(function(){

 $(".price-slider").on( "slide", function( event, ui ) {  console.log("LA RECTM");  var mm = $('.tooltip-inner').text(); console.log(mm);   var divide = mm.split(':');   console.log( "min:" +divide[0] + " max:" + divide[1] )     } );




})

Answer 7

您可以将值传递给任何函数或使用该值设置任何元素：

$(function () {
    $('#slider').slider({
        max: 100,
        slide: function (event, ui) {
            $('#anyDiv').val(ui.value);
        }
    });
});

Answer 8

晚会晚了，但是这个问题仍然没有答案。

下面的示例将向您展示如何在输入字段中的更改时获取价值以保存到DB中：

 $( "#slider-videoTransparency" ).slider({ value: "1", orientation: "horizontal", range: "min", max: 30, animate: true, change: function (e, ui) { var value = $(this).slider( "value" ); $('.video_overlay_transparency').val(value); } }); 

 <div id="slider-videoTransparency" class="slider-danger"></div> <input type="hidden" name="video_overlay_transparency" class="video_overlay_transparency" value=""> 

Answer 9

var value=document.getElementById('slider').value;
var a=value.split("specialName")//name=special charcter between minimum and maximum rang
var b=a[0];//this will get minimum range
var c=a[1];//this will get maximum range

Answer 10

jQuery UI滑块

var slider = $("#range_slider").slider({
    range: true,
    min: 0,
    max: 500,
    values: [0, 500],
    slide: function(event, ui) {
      var x = ui.values[0];
      var y = ui.values[1];
      $('#min').text( ui.values[0] )
      $('#max').text( ui.values[1] )
      $.ajax({
        url: '/search',
        type: 'GET',
        dataType: 'script',
        data: {min:x, max:y,term:food_item_name},
        success: function(repsonse){},
      });
    }
  });
});