如何销毁/删除/取消绑定 Flexslider答案

【问题标题】：How to destroy/remove/unbind a Flexslider如何销毁/删除/取消绑定 Flexslider
【发布时间】：2012-10-24 05:09:24
【问题描述】：

github页面上有一些关于destroy方法的讨论，还有几个关于stack的问题，但还没有一个直接的答案或解决方案，我经过大量搜索才能够找到。

当前版本的 flexslider http://www.woothemes.com/flexslider/ 没有销毁方法。在注释中它说以前的版本 1.8 可以，但是使用该方法不起作用。

我需要取消绑定一个 flexslider 元素，然后在另一个元素上调用 .flexslider()，因为我不希望多个滑块同时运行。

我该怎么做？注意：删除导航元素、删除类、解包 UL 和删除“.clone”li 还不够好！我想将滑块元素完全恢复到原来的状态！

现在我在初始化 flexslider 之前克隆滑块，然后使用.after() 在滑块之后插入克隆，然后移除滑块。但这对我来说似乎是一种非常严厉的方法。

$projCur.addClass('flexslider').flexslider({
    animation: "slide",
    animationSpeed: 500,
    slideshow: false,
    manualControls: '.dot-nav li a'             
});

谢谢！

【问题讨论】：

修改插件或使用 clone/replaceWith 方法是您唯一的选择 - 或 - 切换到具有您需要的功能的另一个插件
如果您想出任何可行的方法，请告诉我们，因为我目前也想做同样的事情。

标签： jquery slideshow destroy flexslider

【解决方案1】：

Github 用户提交了一个拉取请求，为插件添加销毁方法。 https://github.com/woothemes/FlexSlider/pull/771

我使用他的销毁方法获取了这个用户版本的插件，它对我来说非常有用。我从https://github.com/bradgreens/FlexSlider/tree/release-2-2-0得到它

【讨论】：

@BradGreens，布拉德干得好。你帮了我很多。谢谢！ Teegan，感谢您找到 Brad 的拉取请求 :)
非常有用...我只是希望他们快点合并它。

【解决方案2】：

您是否尝试过分离和附加？这将使任何事物的状态甚至事件保持分离。

var flex = $('.flexslider').detach(); //detach
$('body').append(flex); //reattach

【讨论】：

似乎无法让它工作。也试过.empty() 和.remove()。没有运气。

【解决方案3】：

destroy 方法对我不起作用。

我找到的唯一可靠的解决方案（从当前版本 2.2.2 开始）是从 DOM 中完全删除 flexslider 元素，然后恢复它。

类似：

$('.flexslider').remove();
// re-insert clean mark-up so flexslider can reset itself properly
$('.flexslider-container').append('<div class="flexslider"><ul class="slides"></ul></div>');

然后我从头开始重新初始化 flexslider：

var imglist = '<li><img ...></li><li><img ...></li>...';
$('.flexslider ul.slides').html(imglist);
$('.flexslider').flexslider({ 
    ...
});

我还发现这种方法比添加和删除幻灯片以使滑块自行更新更可靠。

【讨论】：

你有没有分享过你的用例，销毁方法“不起作用”？您能否确认您的代码库完全是从github.com/bradgreens/FlexSlider/tree/release-2-2-0 克隆的？
在不调用 destroy() 方法的情况下删除 jQuery 小部件可能会导致内存泄漏。读者当心。
@Mindwin 什么是 destroy()？

【解决方案4】：

对我来说，我找到了这个解决方案：

$('.logo-carousel').flexslider({
   move : 0
});

【讨论】：