Question

我正在使用bootstrap affix插件（3.3.7）来添加一组按钮。我遇到的问题是click事件正在抛弃affix插件。为了测试这个，我有以下内容：

$("#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

单击文档会使其在词缀和词缀顶部样式设置之间切换，因此附加的元素不太知道该怎么做。有人经历过这个并知道如何解决它吗？

Answer 1

经过广泛的研究，我在Affix插件的3.3.7版本中发现了一个错误。在＆＃34; getState＆＃34;方法，有这一行：

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

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

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

解决了这个问题。

点击Action Throwing Off Affix Plugin

1 个答案: