保存并加载页面的ajax状态

我正在使用Wordpress单页组合上的ajax加载function。

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

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

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

 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中添加一个持久容器时没有变化。

有没有办法加载已经显示的post内容的页面，或者在页面加载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'); }); 

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