jquery：ajax的hashchange问题答案

【问题标题】：jquery: problem with the hashchange with ajaxjquery：ajax的hashchange问题
【发布时间】：2011-06-28 14:39:40
【问题描述】：

我正在使用一个 onhashchange 插件，但是当我想通过 ajax 加载页面时，我遇到了一个问题。

这是我的 jquery，

    $(document).ready(function(){

    $(window).hashchange(function() {
        var hash = location.hash;
        var array_url = hash.split('#');
        var page = $(array_url).last()[0];
        $('#content').load( page + '.php', function(){
        });
    });

    $('.clickme').click(function(){

        var url = $(this).attr('href');
        var array_url = url.split('#');
        var page = $(array_url).last()[0];

        location.hash = url;

        $('#content').load( page + '.php', function(){
        });

        return false;
    });

});

html，

<a href="#1" class="clickme">1<a>
<a href="#2" class="clickme">2<a>

<div id="content">
</div>

问题是hash更改后点击链接时，ajax页面会加载两次或更多。

我该如何解决这个问题？

谢谢。

【问题讨论】：

为什么要在数组上使用 jQuery 包装器中的函数？你不知道有内置的方法可以做到这一点，例如array_url.pop()?
@neal：我如何放置日志？语法是什么？谢谢。

标签： jquery jquery-plugins load hashchange

【解决方案1】：

你正在加载两次：

$(window).hashchange(function() {
    var hash = location.hash;
    var array_url = hash.split('#');
    var page = $(array_url).last()[0];
    $('#content').load( page + '.php', function(){ //ONCE
    });
});

$('.clickme').click(function(){

    var url = $(this).attr('href');
    var array_url = url.split('#');
    var page = $(array_url).last()[0];

    location.hash = url; //GOTO HASH CHANGE ^^

    $('#content').load( page + '.php', function(){  //TWICE
    });

    return false;
});

【讨论】：

根本不需要点击事件处理程序。 hashchange 应该在点击链接时触发。
@AndyE -- 这也是正确的，OP 可能需要它进行其他一些操作
@andy：非常感谢您指出！问题解决了！ :-)

【解决方案2】：

摆脱点击监听器内部的 $('#content').load() 调用。这样，当您更改哈希时，只有 hashchange 侦听器会处理 ajax 调用。

【讨论】：