如何更改此JavaScript?

我想更改内容在我的网站上的显示方式:

var FNav = { init: function() { $("a[href*=#]").click(function(e) { e.preventDefault(); if($(this).attr("href").split("#")[1]) { FluidNav.goTo($(this).attr("href").split("#")[1]); } }); this.goTo("home"); }, goTo: function(page) { var next_page = $("#"+page); var nav_item = $('nav ul li a[href=#'+page+']'); $(".page").fadeOut(500); next_page.fadeIn(500); 

如何更改此JavaScript,以便我可以使用正确的后退按钮function?

我尝试了什么 (Unsuccessfuly)。 这些是我尝试的解决方案,但没有更改上面的JavaScript。 这就是为什么我认为它们似乎都不起作用。

  • 使用此处描述的History.js方法: https : //github.com/browserstate/history.js/我填写所有步骤并在标题中输入脚本,但是当我点击时,只有URL栏中的URL发生变化一条链接。 单击“后退”按钮时,URl会相应更改,但内容不会加载。 当我在URL栏中输入URL时,我会被发送到主页。

  • 这里描述的Ajaxify和Gist方法: https : //github.com/browserstate/ajaxify实现与上述相同,同样的问题

  • 这里描述的Davis.js方法: https : //github.com/olivernn/davis.js完成安装说明后什么都不做。 没变。

  • 这里描述的jQuery BBQ插件方法: http ://benalman.com/projects/jquery-bbq-plugin/在网站标题中加载.js文件时什么都不做,没有变化。

  • 我读了这篇文章并理解它: http : //diveintohtml5.info/history.html

我不确定为什么你不能让Davis.js为你工作? 也许在GitHub页面上打开一个问题。

如果要使用davis使用基于散列的路由,则需要包含散列路由扩展 。 然后你需要在davis之后将它包含在你的页面中。

然后,以下设置允许您处理路线

 Davis.extend(Davis.hash) Davis(function () { this.get('/:page', function (req) { FluidNav.goTo(req.params.page); }) }) 

假设您的页面中包含以下链接

 Page1 Page2 

戴维斯将为您处理后退按钮,因此,如果您单击Page1和Page2的链接,单击后退按钮将再次导航到Page1。

如果您有任何问题,请在GitHub页面上打开一个问题,详细说明您拥有的和不起作用的内容,我可以查看它。

后退按钮不会神奇地工作。 您需要编码并监听事件的变化!

在history.js中, 它会在首页显示 :

 // Bind to StateChange Event History.Adapter.bind(window,'statechange',function(){ // Note: We are using statechange instead of popstate var State = History.getState(); // Note: We are using History.getState() instead of event.state History.log(State.data, State.title, State.url); });