Question

我正在尝试使用不同的页面创建一个网站，这些页面都随jquery而变化（也许是ajax，具体取决于最初加载所有内容所需的时间）

基本上，我们的想法是，当您单击某个项目进行查看时，会发生某种动画，然后您可以在不刷新浏览器的情况下查看该项目/页面。每个新的“页面”都与一个哈希值相关联，所以想法是，每当哈希值改变时，一些js函数就会发生变化。我这样做是因为当你按下后退按钮时，哈希值会改变，结果会改变页面的内容。

我很难弄清楚如何监控哈希值，以便在按下后退按钮并且哈希值发生变化时发生某些事情...（我知道如何点击它来检查哈希值价值，我只是停留在后退按钮上）

我的想法是，该功能与我找到http://thinkav.co.nz/

的网站类似

由于

（理想情况下我不喜欢使用插件）

Answer 1

你可以试试jQuery BBQ：Back Button＆amp;查询库

jQuery BBQ: Back Button & Query Library

并阅读有关哈希爆炸网址的内容

Hash URIs

您必须考虑让您的ajax网站可抓取

Making AJAX Applications Crawlable

Answer 2

您要做的是新HTML5规范的一部分，并且主要使用pushState（）方法。这允许网页使用hashmark（＃）作为引用，就像URL一样，因此允许您像往常一样使用后退和前进按钮。我从来没有使用它，但是this should point you朝着正确的方向！快乐的编码！

Answer 3

使用Ben Almans hashchange plugin。它有一个hashchange事件，每次哈希更改时都会触发。

$(document).ready(function() {

      // Bind the event.
      $(window).hashchange( function(){
        // Update page in here
      })

      // Trigger the event when the page first loads to handle the back button
      $(window).trigger("hashchange");
});

Answer 4

页面顶部的网址栏将始终记住锚点而不刷新，只需通过ajax加载内容，让浏览器为您记住。

即：

//the js
function load(){
    var hash = window.location.hash;
    var url = hash+".html";
    $("body").load(url); 
}

$(document).ready(function(){
    $("a").click(function(){
        load();
    });
});

//the html
<a href="#test">click me</a>

这应该将test.html加载到正文中而不进行刷新。

使用jquery创建一个不刷新但后退按钮仍然有效的网站

4 个答案: