Question

我刚刚更新到chrome版本32.0.1700.76 m，我现在注意到hashchange看起来很奇怪。有时候它会起作用，有时却不起作用。

我的主页上有以下代码，几个月后我没有更改代码。几天前工作正常（在我更新到最新的chrome版本之前）：

$(window).on('hashchange', function () {
    var page = location.hash.slice(1);

    $('[data-page]').addClass('hidden');

    $('[data-page=' + page + ']').css('z-index', '0');
    $('#1st-row').children().eq(0).css('z-index', '1');
    $('#1st-row').children().eq(1).css('margin-left', '-200px');    
    $('[data-page=' + page + ']').removeClass('hidden');

    $('#1st-row').children().eq(1).animate(
        { 'margin-left':'0px' }, 1000);

    $(':checkbox').checkbox('check');
    $('#debug').attr('value', 'true');
});

当我重新设计我的网站时，我觉得有些东西不能正常工作，所以我改了一下：

$(window).on('hashchange', function () {
    var page = location.hash.slice(1);

    $('[data-page=' + page + ']').slideDown();
});

但它仍然无效。我必须多次重新加载页面，再次访问该网站（ctrl + l - ＆gt;输入），重新加载几次然后它神奇地工作。虽然它不会再次工作......在决定让hashchange工作之前，我必须刷新并重新加载页面/网站几次。

你可以在lingonsorbet.se上测试它。只需将#advanced添加到网址，右侧就会显示一个框。在firefox中工作正常，即。

我做错了什么或有其他人遇到过这个问题吗？

Answer 1

页面加载时不会触发

`hashchange`

hashchange事件仅在您手动更改哈希值或单击页内锚点链接（<a href="#advanced">Advanced</a>）时触发。在不更改哈希值的情况下重新加载页面不会触发hashchange。

您应该将哈希检查代码重构为新函数并执行它

在hashchange活动
页面加载。

考虑以下代码：

function changeLayoutByHash() {
    var page = location.hash.slice(1);
    $('[data-page=' + page + ']').slideDown();
    // etc.
}

$(window).bind('hashchange', changeLayoutByHash );

$(window).ready( changeLayoutByHash );

根据您的问题，我认为Chrome处理此问题的方式不一致。

如果您继续重新加载example.com#advanced，则不会触发hashchange。只有当您将哈希值更改为example.com#advance（删除一个字符）时，它才会被注册为已更改的哈希值。

调试

要了解某些事件是否被触发，您可以随时在事件处理程序中写一点console.log('hashchange fired');，然后（打开ChromeDev工具）在控制台中查看您的程序执行的操作。

jquery hashchange在chrome 32.0.1700.76 m中出现问题

1 个答案:

`hashchange`

考虑以下代码：

调试