如何在动态加载 jquery 内容时生成可书签的 URL？答案

【问题标题】：How can I generate bookmark able URLs while loading jquery content dynamically?如何在动态加载 jquery 内容时生成可书签的 URL？
【发布时间】：2013-03-10 19:54:55
【问题描述】：

在我的标题中，我有以下脚本来接收输入到函数 recp() 的 id 参数：

<script>
 function take(id) {
  $('#content_div').load('pages.php?id='+id);
 }
</script>

在正文的导航菜单中，我的链接设置如下：

<li><a href="#" onClick="take('food')">Food</a></li>
<li><a href="#" onClick="take('animals')">Animals</a></li>

我的div标签在body里是这样的：

<div id="content_div"><div>

pages.php 有一个条件结构，可以将特定代码注入#content_div，如下所示：

 <?php
 $id = $_GET['id'];
 function showUp($id){
 switch($id){
 case "food":
 include_once "food.php";
 break;
 case "animals":
 include_once'animals.php';
 break;
 }
 ?>

内容正在完美加载，但我的 URL 有问题。我怎样才能使用后退按钮并导航到以前打开的状态以便它们可以被收藏？

【问题讨论】：

jQuery 中的$().load() 不是您将函数绑定到的事件（onLoad）吗？
简单的答案是，你不能。动态加载内容时，您必须使用哈希或 HTML5 的 History API 来更改 URL，而无需加载新页面。
你能发布哈希或 HTML5 的最小实现吗？这正是我需要弄清楚的。我已经汗流浃背了好一阵子
我没有澄清你的问题..你到底想做什么？
假设我点击了食物链接，然后我的 div 加载了 food.php 内容，然后我点击了动物加载了animals.php。加载完animals.php后，应该可以通过返回按钮回到加载food.php的div了。

标签： php javascript jquery html

【解决方案1】：

在您的情况下，您应该以编程方式推送浏览器历史状态。 History.js – 处理这个问题。这里可以拿代码和手册：https://github.com/browserstate/history.js

【讨论】：