防止浏览器跳转到锚点

如何防止浏览器跳转到锚点链接？防止浏览器跳转到锚点

我知道我可以用户在onclick事件“返回false”，或者如果有人使用MooTools的做这样的事情

$('button').addEvent('click', function(e) { 
e.stop() 
//do blabla 
});

这将跳转到锚停止的浏览器，但我想将锚点保持在url中，以便共享链接。我正在使用锚来实际显示动态信息。

任何想法？

来源

2011-04-19 Daniel Dimitrov

我通常处理这个问题的方法是URL哈希不匹配任何名称或网页上的ID属性后使用的值。例如，“＃myValue = foo”而不是“#foo”。如果散列值与页面上的元素匹配，我通常希望窗口滚动到该点。 – 2011-04-19 18:15:57

嘿杰西，我最终也这样做。我正在设置哈希像＃！东西然后我只是删除！当我想用这个散列在页面上做某件事时。 – 2011-04-25 08:20:15

只需立即回滚到页面顶部。

self.scrollTo(0, 0)

我有一个插件，做到了这一点，它发生得如此之快我只是认为锚被打破。我不认为有人会注意到。

来源

2011-04-19 18:09:37 mrtsherman

或者甚至更无缝的方式是在点击处理程序中获取当前窗口的滚动条位置，然后滚动到该位置而不是顶部。如果你将scrollTo（）调用放在setTimeout中，这应该可以工作。 – 2011-04-19 18:12:30

我还没有机会测试这个跨浏览器，所以它可能会在IE中悲惨地失败，但这里是我用哈希链接更新URL，同时处理实际操作时发生的不同点击（使用HTML5 history API）：

var setHash = function(hash) { 
    // Make sure that the hash is the first character, and extract from (presumably) full URL if not 
    if (hash.indexOf('#') > 0) { 
     hash = hash.substr(hash.lastIndexOf('#')); 
    } else if (hash.substr(0, 1) !== '#') { 
     hash = '#' + hash; 
    } 
    // Add our hash element to the history/URL 
    if (window.history.pushState) { 
     window.history.pushState(null, null, hash); 
    } else { 
     window.location = hash; 
    } 
}; 

$('button').addEvent('click', function(e) { 
    e.stop() 
    setHash(this.get('href')); 
    //do blabla 
});

来源

2011-04-19 18:34:51

IE无法正常工作！ – pascalvgemert 2013-05-16 11:49:39

防止浏览器跳转到锚点

回答

相关问题