Question

我正在制作一个在多个目录下有多个不同页面的网页。

目前设置的方式是有一个主页 A 。

在页面 A 上有一个菜单，其中包含指向其他页面的链接。这些页面使用AJAX加载到 A 页面上的div中。

我正在尝试制作它，以便用户可以使用他们选择的菜单中的当前内容为页面添加书签。我通过制作GET变量并发布页面“目录/名称”来完成此操作。现在的问题是让用户可以按下浏览器上的后退按钮，提供与此类无法加载的页面相同的功能。

是否有某种方法可以使用后退功能来获取以前的页面并加载它们？我知道最简单的方法是忘记加载页面，它会很好地解决所有问题，但是在这一点上我很好奇为此解决了这个问题。

正在使用Javascript，但jQuery库不是。

干杯。

编辑：添加基本代码功能。

<div id="content">
<p>Hello</p>
</div>

<p onclick="load('dir/file')">Link1</p>
<p onclick="load('dir/file')">Link2</p>

<script>
window.onbeforeunload = function() {
 load(getVar("page"));
}
function getVar (name) {
     name = RegExp ('[?&]' + name.replace (/([[\]])/, '\\$1') + '=([^&#]*)');
     return (window.location.href.match (name) || ['', ''])[1];
}
function load(val) {
    loadPage(val+".html", "content");  //This just does an ajax call and puts the content into the second value.
    window.history.pushState({},"IBM","https://labweb.torolab.ibm.com/groups/websphere/WASL3/l3_new/index.php?page="+val);
}
</script>

我认为这是它的基本功能。

Answer 1

我认为你的问题是哈希标签浏览。

jquery javascript: adding browser history back with hashtag?。

这个例子使用了jquery，但是当你点击链接来更新页面时，你只需要做一个事件就像你已经有类似的东西一样。

Change the URL in the browser without loading the new page using JavaScript

此示例可让您更好地了解仅使用Javascript即可执行的操作。

现在，当他们使用书签加载页面时不会这样做，因为没有浏览器历史记录，但在使用页面时会有效。

<a href="#hashtag" class="loadpage" data-page="directory/name">

加载带书签和后退/前进支持的页面

1 个答案: