我正在尝试同时更新幻灯片上的多个滑块,并更改JQuery UI中的滑块事件.
$(function() {
var totalSliders = 0;
$(".slider").each(function() {
var value = parseInt($(this).text(), 10);
$(this).empty().slider({
value: value,
range: "min",
animate: true,
orientation: "horizontal",
slide: updateSliders,
change: updateSliders
});
totalSliders++;
});
function updateSliders(event, ui) {
var activeSlider = this;
$(".slider").slider("value", $(activeSlider).slider("value"));
};
$("#update").click(function() {
$(".slider").slider("value", 10);
return false;
});
});
这样可以成功地将所有带有一类滑块的内容转换为滑块.但是,每当移动滑块时,都会出现以下错误:
Uncaught RangeError: Maximum call stack size exceeded
我还尝试了以下updateSliders的实现:
function updateSliders(event, ui) {
var activeSlider = this;
$(".slider").not(activeSlider).slider("value", $(activeSlider).slider("value"));
};
以下updateSliders(event,ui)的实现工作正常:
function updateSliders(event, ui) {
console.log($(this).slider("value"));
};
编辑:
我在页面上只有三个元素,并带有一类滑块,如果有区别的话.
解决方法:
尝试修改该处理程序:
function updateSliders(event, ui) {
if (!event.originalEvent) return;
var activeSlider = this;
$(".slider").slider("value", $(activeSlider).slider("value"));
};
我猜,这可能会导致代码出现其他问题,但是通过检查空的“ originalEvent”属性,您可以知道由于编程更新而导致何时调用“ change”处理程序.这将使您正在使用该功能进行的所有更新不会引起进一步更改的风暴.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。