[英]Jquery UI getting value from slider
I have two sliders in my page : one with period and the other one with amount. 我的页面中有两个滑块:一个带有句点,另一个带有数量。 I want to get the values of the sliders every time them are changed, and that values use in another function.
我想每次更改滑块时获取它们的值,并且这些值将在另一个函数中使用。 Here is my code
这是我的代码
For period slider 对于期间滑块
$(function() {
$( "#slider-period" ).slider({
range : "max",
min : 3,
max : 12,
value : 4,
slide : function (event,ui) {
$(".period").html(ui.value+" years");
},
change : function (event,ui) {
$(".period").html(ui.value+" years");
}
});
});
For amount slider: 对于数量滑块:
$(function() {
$( "#slider-amount" ).slider({
range : "max",
min : 500,
max : 150000,
step : 1000,
value : 1200,
slide : function (event,ui) {
$("#amount").html(ui.value+" RON");
},
change : function (event,ui) {
$("#amount").html(ui.value+" RON");
}
});
});
I want to make two global variables that are actualized every time the sliders are changed. 我想使两个全局变量在每次更改滑块时都实现。 Any idea?
任何想法?
Try making a global function that is called whenever they are updated. 尝试制作一个在每次更新时都会调用的全局函数。
function sliderUpdated() {
var periodVal = $( "#slider-period" ).slider("option", "value");
var amountVal = $( "#slider-amount" ).slider("option", "value");
//dostuff
}
For period slider 对于期间滑块
$(function() {
$( "#slider-period" ).slider({
range : "max",
min : 3,
max : 12,
value : 4,
slide : function (event,ui) {
$(".period").html(ui.value+" years");
},
change : function () {
sliderUpdated();
}
});
});
For amount slider: 对于数量滑块:
$(function() {
$( "#slider-amount" ).slider({
range : "max",
min : 500,
max : 150000,
step : 1000,
value : 1200,
slide : function (event,ui) {
$("#amount").html(ui.value+" RON");
},
change : function () {
sliderUpdated();
}
});
});
You can just make two variables at the top of your script and update them from the change method of the jquery slider. 您可以在脚本顶部创建两个变量,然后通过jquery滑块的change方法更新它们。 For example
例如
var years;
var amount;
$(function() {
$( "#slider-period" ).slider({
range : "max",
min : 3,
max : 12,
value : 4,
slide : function (event,ui) {
$(".period").html(ui.value+" years");
},
change : function (event,ui) {
$(".period").html(ui.value+" years");
years = ui.value;
}
});
});
$(function() {
$( "#slider-amount" ).slider({
range : "max",
min : 500,
max : 150000,
step : 1000,
value : 1200,
slide : function (event,ui) {
$("#amount").html(ui.value+" RON");
},
change : function (event,ui) {
$("#amount").html(ui.value+" RON");
amount = ui.value;
}
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.