-2

我在 wordpress 单页网站上使用 ajax 加载内容。我试图在每次加载 ajax 帖子时更改 url。

这是我在单击项目时用来修改哈希的代码。加载函数正在工作，所以为了清楚起见，我没有将它添加到下面的代码中（它只需要单击的 li 的 href 并将内容加载到 div 中）。

    $(document).ready(function() {
        $.ajaxSetup({cache: false});

        $('#portfolio-list li:not(#DrawerContainer)').click(function() {

           window.location.hash = "#!" + this.pathname;
           alert(window.location.hash);

        //And here comes the loading part

        return false;
        });

    return false;       
    });

不幸的是，唯一添加到我的网址的是#!undefined. 并提醒window.location.hash或this.pathname给我相同的结果。

我需要什么才能在地址栏中将路径名作为哈希返回？

4

1 回答 1

0

根据您的结构，这应该使您的友好哈希：

var pathname = $(this).find('a')[0].href.split('/'),
    l = pathname.length;
pathname = pathname[l-1] || pathname[l-2];
window.location.hash = "#!" + pathname;

演示

现在要使 URL 可共享，您需要对 DOM 就绪执行哈希检查并加载相应的内容。

如果所有页面都在同一个目录下，你可以直接这样做：

 $(function() {
     var hash = window.location.hash;
     //checks if hash exists and is hash bang
     if (hash && hash.substring(0, 2) === '#!') {
         hash = hash.substring(2); //removes leading #!
         $('#content').load('path/to/' + hash);
     }
 });

演示

如果页面不在同一个目录中，则需要将哈希映射到地址。

$(function() {
    var hashmap = {
        'test5': 'http://foobar.baz/fooz/test5',
        'anotherTest': 'http://foobar.baz/barz/anotherTest',
    };
    var hash = window.location.hash;
    //checks if hash exists and is hash bang
    if (hash && hash.substring(0, 2) === '#!') {
        hash = hash.substring(2); //removes leading #!
        if (hashmap[hash]) { //checks if hash exist in the hash map
            $('#content').load(hashmap[hash]);
        }
    }
});

演示

我在上面的演示中使用了警报，因为加载会失败。当然，您必须$('#content').load通过您喜欢的加载方法来调整/替换。

于 2012-11-06T11:53:43.723 回答