html - 单击链接时防止页面转到顶部

Question

如何防止每次单击链接时页面“跳起来”？例如，我在页面中间某处有一个链接，当我单击它时，页面会跳到顶部。

Answer 1

是锚href="#"？您可以将其设置为href="javascript:void(0);"。

如果您要阻止默认设置，请改用这个：

event.preventDefault ? event.preventDefault() : event.returnValue = false;

Answer 2

假设这是您的链接 HTML：

<a href="#something" id="some_id">Some link goes somewhere...</a>

如果您使用的是jQuery，请尝试这样：

$(document).ready(function() {
    $('a#some_id').click(function(e) {
        e.preventDefault();
        return false;
    });
});

演示：http: //jsfiddle.net/V7thw/

如果您不使用 jQuery 药物，请尝试使用这个纯DOM JavaScript：

window.onload = function() {
    if(document.readyState === 'complete') {
        document.getElementById('some_id').onclick = function(e) {
            e.preventDefault();
            return false;
        };
    }
};

Answer 3

href如果您将链接属性设置为，它将跳转到顶部，#因为它正在寻找锚标记。只需离开该href属性，它就不会去任何地方，但它看起来也不再像一个链接（并确保click在 javascript 中处理偶数，否则它真的没有多大用处）。

另一个选项是在 javascript 和事件处理程序中处理单击，取消默认操作并返回 false。

   e.preventDefault();
   return false;