Question

我正在使用Wordpress单页组合中的ajax加载功能。

原则是当您单击库中的缩略图时，它会打开一个容器（#DrawerContainer）并将此文章的ajax内容提取到其中。有很多帮助，当我点击缩略图时，我已经能够打开抽屉并加载帖子内容。

如果你想看到它工作，这是一个小提琴（ajax不会加载，但它在本地工作）。 http://jsfiddle.net/RF6df/24/

我正在处理的部分：我需要我的网站可以抓取并且网址可以共享。如果我将http://mywebsite.com/#!project5提供给某人，我需要在加载页面时打开project5内容我认为hash-bang（＃！）url是实现这项工作的方法。使用下面的代码（在jsfiddle上评论），我可以更新网址并添加点击的缩略图的哈希值。

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

但是当我加载页面时，ajax状态不会被记住。我以为是因为我的ajax容器只在click事件上加载，但是当我在php中添加一个持久容器时没有变化。

有没有办法加载已经显示过帖子内容的页面，或者在页面加载hash-bang url时打开#DrawerContainer？

请记住，我只是在学习jquery和ajax。所以，如果你解释或评论你做了什么，我真的很感激，我肯定会在同一时间学习...... :)

Answer 1

在onload上你应该检查window.location.hash并触发对特定链接/ div的点击。

$(document).ready(function() {
    var hash = window.location.hash;
    if ( hash.length > 0 ) {
        hash = hash.replace('#' , '' , hash );
        $('a[rel="'+hash+'"]').trigger('click');
    }
});

Answer 2

我在要通过哈希更改触发的网站上使用了以下内容。

首先，我绑定一个hashchange事件来获取哈希值

 $(window).bind('hashchange', function(o){

            url = window.location.hash.substring(1);

            o.preventDefault();



        if (!url) {
            return;
        }

 }

然后我会在我想要的时候触发哈希交换 - 在你的情况下，当页面加载时，即在文档就绪时。

jQuery(document).ready(function($) {
   $(window).trigger('hashchange');
});

然后，您可以在函数中使用加载正确内容的哈希值

保存并加载页面的ajax状态

2 个答案: