jquery – FlexSlider是否有destroy方法

前端之家收集整理的这篇文章主要介绍了jquery – FlexSlider是否有destroy方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
当我异步调用新的图库列表时,我试图在页面刷新时重新初始化FlexSlider.

我认为下面的例程可行,但事实并非如此.即使新图像成功加载,似乎第一个FlexSlider仍然存在.

有没有办法摧毁,然后重建画廊?

谢谢

  1. function flexInit() {
  2. $('.flexslider').flexslider({
  3. animation: "slide",controlsContainer: ".paginator",manualControls: 'a',after: function(slider){
  4. if(slider.atEnd == true) {
  5. // ??? slider.destroy;
  6. galBuild();
  7. }
  8. }
  9. });
  10. }
  11.  
  12. function galBuild() {
  13. $.getJSON("/gallery/next/"+galID,function (data) {
  14. var results = data.objects;
  15. var list = $(".flexslider ul.slides");
  16. var i = 0;
  17. $.each(results,function () {
  18.  
  19. list.append('<li><p>' + results[i].title + '</p><img src="' + results[i].src + '"><p class="flex-caption">' + results[i++].caption + '</p></li>');
  20.  
  21. });
  22.  
  23. flexInit();
  24.  
  25. });
  26. }
  27.  
  28. galBuild();

解决方法

我正在使用不同的方法,即

你已经开始使用一个flexslider:

  1.  
  2. $('#element).flexslider({
  3. animation: "slide",controlNav: false,directionNav: true
  4. });
  5.  

当我想在之前创建的滑块中更改幻灯片并重新启动它时,id执行以下操作:

>创造临时div:

  1. $('#element).before('
  2. <div id="element_temp" class="flexslider"></div>
  3. ');

>使用先前创建的滑块删除div

  1. $('#element).remove();

>将新幻灯片列表插入临时div:

  1. var html = `
  2. <ul class='slides">
  3. <li><img src="link to image" /></li>
  4. <li><img src="link to image" /></li>
  5. <li><img src="link to image" /></li>
  6. </ul>`;
  7. $('#element_temp').html(html);

>在临时div上启动flexslider

  1. $('#element_temp').flexslider({
  2. animation: "slide",directionNav: true
  3. });

>将div ID从element_temp更改为element

  1. $('#element_temp').attr('id','element');

它适用于多个flexliders

猜你在找的jQuery相关文章