Twitter bootstrap scrollspy - 在平滑滚动时禁用？答案

【问题标题】：Twitter bootstrap scrollspy - disable on smooth scroll?Twitter bootstrap scrollspy - 在平滑滚动时禁用？
【发布时间】：2013-09-19 09:36:47
【问题描述】：

我们在侧边栏 ul/il 列表上使用 twitter bootstrap scrollspy，效果很好。但是，当单击侧边栏中的链接时，我们也会使用平滑滚动。这会导致 scrollspy 突出显示进入视野的每个元素，就像在正常情况下一样。

但是，当通过单击侧导航中的链接触发滚动时，用户很可能不希望菜单在滚动时出现动画。有什么方法可以在动画滚动运行时暂时禁用 scrollspy，然后在滚动完成后重新启用它？

【问题讨论】：

您是否尝试过暂时删除data-spy 属性（假设您使用的是data-）？
我正在使用javascript来激活它
在这种情况下，尝试将一个类设置为数据目标，在滚动动画运行时删除该类，并在动画完成后重新插入该类？ $('body').scrollspy({ target: '.spy-active' });
这就像一个魅力......做出一个答案，我会标记它

标签： javascript twitter-bootstrap html-lists twitter-bootstrap-3 scrollspy

【解决方案1】：

通过将类设置为scrollspy 的目标，您可以动态停止/恢复scrollspy 操作。

$('body').scrollspy({ target: '.spy-active' });

现在只需在导航上添加或删除.spy-active 类。

【讨论】：

问题是在重新激活（读取类）时，scrollSpy 不会刷新当前活动类。
@dude，您可以通过在complete 回调中对.animate 的事件执行某些操作来重新启用该类，例如：complete: function() { $("#nav").addClass("active-spy"); $(event.target.parentNode).addClass("active"); }。这是一个小提琴：jsfiddle.net/o92wrpg8/2

【解决方案2】：

将以下内容添加到本地 javascript 的顶部...

$.fn.scrollspy.Constructor.prototype.destroy = function(){
    this.$element.off('scroll.bs.scroll-spy.data-api');
    this.$body.removeData('bs.scrollspy');
    return this.$body;
}

【讨论】：

您能否解释一下这是如何工作的，特别是仅解除scroll.bs.scroll-spy.data-api 事件（我从未听说过）如何自动解除所有其他scrollspy 事件？
通过在 link 仔细阅读实际的 ScrollSpy 插件代码，您可以看到只有一个事件附加到 scrollspy 元素。 'scroll.bs.scroll-spy.data-api' 事件。