如何更改此JavaScript？ [英] How do I change this JavaScript?

问题描述

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

I want to change the way that content is displayed on my website:

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，以便我可以使用正确的后退按钮功能？

How do I change this JavaScript, so I can have a proper back button functionality?

我尝试了什么（不成功）。这些是我尝试的解决方案，但没有更改上面的JavaScript。这就是为什么我认为它们似乎都不起作用。

What I have tried (Unsuccessfuly). These are the solutions that I tried but without changing the javascript above. That is why I think none of them seem to work.

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

• Using the History.js method described here: https://github.com/browserstate/history.js/ I fill out all the steps and enter the scripts to the header, however only the URL in the URL bar changes when I click on a link. When I click the Back button, the URl changes accordingly, but content doesn't load. When I enter a URL in the URL bar, I get sent to the home page.

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

Ajaxify and Gist method described here: https://github.com/browserstate/ajaxify Achieves the same as above, same issues as well

戴维斯这里描述的.js方法：
https://github.com/olivernn/davis.js完成后无成就
安装说明。没有变化。

Davis.js method described here: https://github.com/olivernn/davis.js Achieves nothing upon completion of the installation instructions. No change.

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

jQuery BBQ Plugin method described here: http://benalman.com/projects/jquery-bbq-plugin/ Achieves nothing, no change upon loading the .js file in the header of the website.

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

I read this article and understood it: http://diveintohtml5.info/history.html

推荐答案

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

The back button does not magically work. You need to code and listen for the event change!

在history.js中，它会在首页显示：

In history.js, it shows you right on the front page:

// 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);
});

这篇关于如何更改此JavaScript？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！