0

我们想要动态更新 nivo 滑块以获取转换类型、暂停时间等。我们正在调用链接的点击事件的函数。这是函数：

function fnSetPauseTime(navType) {
    var getSec = $('#setSliderTime').val();
    getSec = (getSec) * 1000;

    var sliderId = $('#' + IdParent).children().attr('id');
    $('#' + sliderId).attr('pauseTime', getSec);
    var transType = $('#changeTrans').val();
    //var transType = $('.controlNav').is('checked');
    var getSec = $('#setSliderTime').val();
    slideShow(sliderId, getSec, transType, navType);
}

这是调用上述函数的点击事件

$('.controlNav').click(function () {
    var navType = $(this).val();
    if (navType == 'thumbNav') {
        navType = 'true';
    } else {
        navType = 'false';
    }
    fnSetPauseTime(navType);
    //slideShow(sliderId, '');
});

这是nivo-slider.js文件中的默认幻灯片功能。

function slideShow(sliderId, getSec, transType, navType) {
  $('#' + sliderId).nivoSlider({
    effect: 'random',
    slices: 15,
    boxCols: 8,
    boxRows: 4,
    animSpeed: 500,
    pauseTime: 3000,
    startSlide: 0,
    directionNav: navType,
    controlNav: navType,
    controlNavThumbs: navType,
    pauseOnHover: true,
    manualAdvance: false,
    prevText: 'Prev',
    nextText: 'Next',
    randomStart: false,
    beforeChange: function () {},
    afterChange: function () {},
    slideshowEnd: function () {},
    lastSlide: function () {},
    afterLoad: function () {}
  });
}

问题：我们既不能动态更新参数，也没有得到任何错误。它在文件加载时起作用（即第一次）。不确定是什么错误，或者我们做错了。请建议解决方案。

4

1 回答 1

2

只需在初始化滑块之前销毁节点并替换它。

//Save the DOM node before a slider is binded to it
var slider = $('#' + sliderId).clone();

function slideShow(sliderId, getSec, transType, navType) {
   var newSlider = slider.clone(),
   var oldSlider = $('#' + sliderId);
   oldSlider.after(newSlider);
   oldSlider.remove();

   newSlider.nivoSlider({
      ...
   }   
}
于 2013-03-08T14:48:55.493 回答