单击href =＃SomeDivName时页面向下滚动

Question

我正在使用Twitter的Bootstrap顶部栏。

当我点击一些导航href

href=#SomeDivName

就像当你按下此页面中的导航时：

http://twitter.github.com/bootstrap/examples/fluid.html#contact

页面向下滚动了一下。

我希望点击后会显示相关部分，但我不希望页面向下滚动。

Answer 1

$('a[href="#SomeDiveName"]').on('click', false);

当您单击href属性设置为#SomeDiveName的锚标记时，这将返回false。 这将阻止元素的默认行为，在这种情况下，滚动到href属性引用的元素。

如果您有一组这些链接，那么我建议添加一个类来识别它们，以便您可以一次性选择它们：

$('.stop-this-link').on('click', false);

每当单击该元素时，这将阻止具有stop-this-link类的所有元素的默认行为。 按类选择要比属性快得多。 按属性搜索时，必须检查DOM中的每个元素。

请注意，在jQuery事件处理程序中返回false与调用： event.preventDefault()和event.stopPropagation() 。

有关这些功能的更多信息，请参见此处：

• event.preventDefault() ： http ： //api.jquery.com/event.preventdefault
• event.stopPropagation() ： http ： //api.jquery.com/event.stoppropagation

Answer 2

而不是使用<a href="#target">使用<a data-target="#target">并删除href属性

Answer 3

Jasper的答案是正确的，但是如果你以后绑定其他东西，你可能会有些奇怪。 我倾向于使用这个：

 $('.stop-this-link').on('click', function(e){ e.preventDefault() });

本质上是相同的，但重要的是它不会阻止事件在DOM上传播，代价是稍微冗长。