1

我正在使用引导附加插件（3.3.7）来附加一组按钮。我遇到的问题是点击事件正在抛出词缀插件。为了测试这一点，我有以下内容：

$("#MainSpySection")
.on("affix.bs.affix", function (e) {
   $.addLog("affix::affix");
})
.on("affixed.bs.affix", function (e) {
   $.addLog("affix::affixed");
})
.on("affix-top.bs.affix", function (e) {
   $.addLog("affix::affix-top");
})
.on("affixed-top.bs.affix", function (e) {
   $.addLog("affix::affixed-top");
});

MainSpySection 元素非常简单：

<div id="MainSpySection" data-spy="affix" data-offset-top="0">
    <button type="submit" id="SaveButton" name="Action" value="SAVE" class="btn btn-default">Save</button>
</div>

我确实添加了一些自定义 CSS，但这不应该影响它：

.affix {
     top: 5px;
     -webkit-transition: all .5s ease-in-out;
     transition: all .5s ease-in-out;
     background-color: #d4dfed;
     border-color: #c2d2e5;
     padding:5px 20px;
     z-index:1000000
}

当我向下滚动时，效果很好，当我到达顶部时，按钮重置很好。但是，每次我单击任何内容（元素或背景）时，MainSpySection 元素都会切换到滚动模式。使用上面的日志记录示例，我看到了这些日志语句：

affix::affixed
affix::affix
affix::affixed-top
affix::affix-top

单击文档会导致它在 affix 和 affix-top 样式设置之间切换，因此被附加的元素不太清楚该做什么。任何人都经历过这个并知道如何解决它？

4

1 回答 1

1

经过大量研究，我在 3.3.7 版本的 Affix 插件中发现了一个 bug。在“getState”方法中，有这一行：

if (offsetTop != null && this.affixed == 'top') return scrollTop < offsetTop ? 'top' : false

解决方法是简单地使小于小于或等于：

if (offsetTop != null && this.affixed == 'top') return scrollTop <= offsetTop ? 'top' : false

这解决了问题。

于 2018-05-31T19:06:20.140 回答