使用this question的第二个答案我为4句柄jquery滑块编写了一个代码。它工作正常,但后来我必须在同一页面中制作多个滑块,所以我尝试模拟我的代码,分离幻灯片功能。现在滑块中的处理程序重叠完全忽略了我为该情况设置的条件。
以下是我的幻灯片功能的代码以及我如何在滑块设置中调用它:
幻灯片功能:
function slidegen(event,ui,index){
//Code for handler 0
if(ui.handle == $("#weightage_slider_"+index+"_0").get(0)){
if(ui.values[0] >= ui.values[1]){
/*FOR SOME REASON THE NEXT LINE HAS NO EFFECT*/
$("#weightage_slider_"+index).slider('values', 0, ui.values[1]);
return false;
} else {
// handle-0 will move
// update display of colored handle ranges
$("#weightage_slider_a_"+index).css('left', '0%');
$("#weightage_slider_a_"+index).css('width', (to100(ui.values[0])+'%'));
$("#weightage_slider_b_"+index).css('left', (to100(ui.values[0])+'%'));
$("#weightage_slider_b_"+index).css('width', ((to100(ui.values[1])-to100(ui.values[0]))+'%'));
}
}
/*SIMILAR CODE FOR THE REST OF THE HANDLERS HERE*/
}
滑块设置:
$("#weightage_slider_0").slider({
min: 1,
max: 5,
step: 0.01,
values: handlers, // set four handles
slide: function(event, ui) {
slidegen(event,ui,0);
},
change: function(event, ui) {
changen(event,ui,0);
}
});
据我所知,在幻灯片中,会出现以下序列:(i)更改ui.value(ii)调用滑块功能(iii)移动滑块手柄。可能是因为我在滑块函数中进行了另一个调用,因此我发生了错误,因此我正在改变那个序列吗?
答案 0 :(得分:0)
问题解决了!您似乎无法将要用作设置的功能模块化。我认为它必须与范围问题有关。相反,我将整个滑块创建模块,如下所示或this link
function makeslider(index,h) {
$("#weightage_slider_" + index).slider({
min: 1,
max: 5,
step: 0.01,
values: h,
// set four handles
slide: function(event, ui) {
/*Generic slide function code here*/
},
change: function(event, ui) {
/*Generic change function code here*/
},
create: function(event, ui) {
/*Generic create function code here*/
}
});
}
makeslider(0, handlers);
makeslider(1, handlers1);
makeslider(2, handlers2);