Bootstrap工具提示导致屏幕在iPad上跳转

Question

因此,当使用Knockout.js将工具提示应用于某些KO绑定HTML元素时,我正在使用knockout-bootstrap.js lib来协助引导工具提示初始化.

<a href="#" data-bind="attr: { tabindex: -1 }, tooltip: { title: buyerHelp, placement: 'top', trigger: 'click', container: 'body' }"><i class="glyphicon glyphicon-help"></i></a>

我正在使用触发器:'click'而不是悬停,因为悬停工具提示在使用iPad显示后不会再次隐藏自己.当我点击工具提示图标时,工具提示显示正常但如果页面滚动则会跳回到顶部.我不确定这个问题应该采取什么方向.

我目前正在使用Bootstrap 3.0,但与Boostrap 2.3有同样的问题谢谢!

Answer 1

当您点击该链接时，该链接是否真的被点击了？就像页面在单击后尝试加载锚点的 href 值一样？由于整个标签未包含在您的示例中，我不确定它是否是一个锚点。而且我不确定 knockout-bootstrap.js 库是否确保防止数据绑定事件返回（因为它们会在默认点击事件上）。如果锚点尝试跟随点击链接，您可以尝试观察点击事件并阻止数据绑定中的事件。比如在工具提示之后：

data-bind="attr: { tabindex: -1 }, tooltip: { title: sellerHelp, placement: 'top', trigger: 'click' }, click: function(data, event) { event.preventDefault(); }"

希望这有帮助！

一般来说，最好将处理程序放在 viewModel 中并从那里阻止它，而不是内联。

阅读一下淘汰赛中处理点击事件的方式可能会很好：http://knockoutjs.com/documentation/click-binding.html