Javascript 如何从 jQuery UI 滑块中获取价值？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2939865/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to get value from jQuery UI slider?
提问by atinder
I am working on http://gamercity.info/ymusic/.
And I am using UI slider as seek bar.
While the video is played I want to invoke a seekTo(seconds)function if user clicked anywhere on the seek bar. How to get new value of secondsafter click event?
我正在http://gamercity.info/ymusic/ 上工作。我使用 UI 滑块作为搜索栏。在播放视频时，seekTo(seconds)如果用户单击搜索栏上的任意位置，我想调用一个函数。如何获得seconds点击事件后的新值？
回答by chad.mellor
To read slider value/percentage value at anytime:
随时读取滑块值/百分比值：
var val = $('#slider').slider("option", "value");
回答by Ben
$('#slider').slider({
change: function(event, ui) {
alert(ui.value);
}
});?
回答by wal
var val = $("#slider").slider("value");
回答by Kiran Shakya
I checked all the answers mentioned above, but found none useful as the following code:
我检查了上面提到的所有答案，但发现以下代码没有用：
$('#slider').slider("values")[0]; // for slider with single knob or lower value of range
$('#slider').slider("values")[1]; // for highest value of range
Tested with jQuery v2.1.1and jQuery-ui v1.12.1
使用jQuery v2.1.1和jQuery-ui v1.12.1 测试
回答by Hitesh
$("#slider").slider(
{
value:100,
min: 0,
max: 500,
step: 50,
slide: function( event, ui ) {
$( "#slider-value" ).html( ui.value );
}
}
);
JS FIDDLE EXAMPLE : http://jsfiddle.net/hiteshbhilai2010/5TTm4/1162/
JS 小提琴示例：http: //jsfiddle.net/hiteshbhilai2010/5TTm4/1162/
you can have a function like this
你可以有这样的功能
function seekTo(seek_value)
{
$("#slider").slider('option', 'value',seek_value);
}
回答by Andy Cancho
// 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] ) } );
})
回答by sivamani
JQuery ui slider
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){},
});
}
});
});
回答by Webistan
Late to the party but this question has still unanswered.
晚会晚了，但这个问题仍然没有答案。
Below example will show you how to get value on change in an input field to save in 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="">回答by shahbaj khan
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
回答by Israel Margulies
You can pass the value to any function or set any element with the value:
您可以将该值传递给任何函数或使用该值设置任何元素：
$(function () {
$('#slider').slider({
max: 100,
slide: function (event, ui) {
$('#anyDiv').val(ui.value);
}
});
});
