Question

基本上，我想构建一个beforehashchange事件。我希望在 hashchange事件影响页面之前执行代码（即：滚动到目标）。

我所知道的唯一可以改变哈希值（导致hashchange事件）的事情是：

点击<a href="#foo">，在这种情况下，我可以捕获click事件，并检查指向哈希的链接。

手动更改网址栏中的哈希值，我可以忽略（除非有人知道在触发hashchange之前检测到这种情况的方法吗？）

还有其他方法可以触发hashchange吗？

Answer 1

我想知道同样的事情，因为我希望在hashchange事件被触发之前访问滚动位置。

一种解决方案是使用scroll事件存储滚动位置，然后在hashchange上回复它。例如，要将滚动位置重置为单击锚点之前的位置，您可以执行以下操作：

var X = 0, Y = 0;
window.addEventListener('scroll', function (e) {
    X = document.body.scrollTop;
    Y = document.body.scrollLeft;
});
window.addEventListener('hashchange', function (e) {
    document.body.scrollTop = X;
    document.body.scrollLeft = Y;
});

除了访问滚动位置，我认为您不需要beforehashchange事件。

Answer 2

只有hashchange个事件。要在哈希更改之前捕获一些信息，您可以向所有链接标记添加data-check-hash之类的属性：

<a href="#test" data-check-hash>foo</a>

$('body').on('click', 'a[data-check-hash]', function(e) {
    e.preventDefault();
    var $item = $(e.currentTarget), 
        hashValue = $item.attr('href').slice(1);

    // here goes your check code before hash change
    window.location.hash = hashValue;
    return false;
});

如何在哈希转换之前执行代码？

2 个答案: