我在我的网站上设置了一个滑动面板。
当它完成动画时,我像这样设置哈希
function() { window.location.hash = id; }
(这是一个回调,id之前分配了 )。
id
这很好用,允许用户为面板添加书签,也可以让非 JavaScript 版本工作。
但是,当我更新哈希时,浏览器会跳转到该位置。我想这是预期的行为。
我的问题是:我怎样才能防止这种情况发生?即如何更改窗口的散列,但如果散列存在,浏览器 不滚动到元素? 某种event.preventDefault()东西?
event.preventDefault()
我正在使用 jQuery 1.4 和scrollTo 插件。
非常感谢!
这是更改面板的代码。
$('#something a').click(function(event) { event.preventDefault(); var link = $(this); var id = link[0].hash; $('#slider').scrollTo(id, 800, { onAfter: function() { link.parents('li').siblings().removeClass('active'); link.parent().addClass('active'); window.location.hash = id; } }); });
有一种解决方法是在现代浏览器上使用历史 API 并回退旧浏览器:
if(history.pushState) { history.pushState(null, null, '#myhash'); } else { location.hash = '#myhash'; }
归功于 Lea Verou