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属性它就不会去任何地方，但它也不再像链接一样（并确保即使在javascript中也能处理click，否则它真的不会很有用）。

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

   e.preventDefault();
   return false;

单击链接时阻止页面转到顶部

3 个答案: