Javascript 使用AJAX/jQuery动态更改页面内容并设置哈希

我正在尝试创建一个网页，使用AJAX动态填充一个div。我已经能够使用以下AJAX代码简单地更新div内容：

$(document).ready(function(){
    $("#projects-list a").click(function(e){ 
        e.preventDefault();
        var url = $(this).attr('href'); //get the link you want to load data from
        $.ajax({ 
            type: 'GET',
            url: url,
            success: function(data) { 
                $('#content').fadeOut(300, function() {
                    $('#content').html(data).delay(200).fadeIn(300);
                });
            } 
        }); 
    });
});

---

然而，我也希望找到一种方法来更新页面URL或更改哈希。因此，例如，当用户获得指向/projects.html的链接时，他们将被发送到一个包含链接的页面，然后单击链接时，内容将使用AJAX更改，url将首先更改为/projects.html。通过这种方式，然后用户导航到/projects.html#首先，他们将看到第一个项目的内容，而不是可供选择的原始项目列表。

如果要使用标准#则可以通过js使用，在函数调用时执行以下操作：

window.location.hash=valueYouWantToSet

，一些ID

然后，您可以在页面加载时检查其中是否有#，然后调用特定函数，如：

handleHash: function () { if (!isNaN(parseInt(window.location.hash.replace('#', '')))){ this.showDetails(window.location.hash.replace('#', '')); }

---

我建议使用库来处理

URL

和

路径

---

看看

history.js

。它以同样适用于HTML4浏览器的方式包装HTML URL重写（通过在这些浏览器上使用hashtag）。它提供可用于执行所需动态导航的更改事件。。