无法理解History.js,需要简化吗？

Question

我对编程很新,我在jQuery的帮助下创建了一个AJAX站点.

我已经为AJAX历史处理程序了解了一下,并认为History.js似乎是最好的/最新的.

我的菜单按钮每个都有自己唯一的ID(#homeBtn,#featureBtn,#pricingBtn),目前看起来像这样:

<a href="#home" class="homeMainMenuButton" id="homeBtn"><div class="homeMainMenuButtonText">Home</div></a>

关于如何实现History.js,有人能给我一个例子(最好是关于jsfiddle)吗？

我似乎无法掌握作者给出的任何例子,我只需要一个愚蠢的版本= b

如果您需要更多信息,请告诉我,谢谢!

Answer 1

按照此处的说明操作:https://github.com/browserstate/ajaxify

更改链接到传统联系href="#home"到href="/home"-确保http://mywebsite.com/home作品.这都是关于优雅的升级.

Answer 2

我认为你需要的"愚蠢"版本是路由器抽象.我为自己的目的写了一个简单的,叫做StateRouter.js.它基本上负责将应用程序支持的URL指向正确的函数,甚至可以定义路由的参数部分(例如http://example.com/persons/id的'id'部分成为函数参数) .

这个简单的示例代码应该演示它是如何使用的:

var router = new staterouter.Router();
// Configure routes
router
  .route('/', getHome)
  .route('/persons', getPersons)
  .route('/persons/:id', getPerson);
// Perform routing of the current state
router.perform();
// Navigate to the page of person 1
router.navigate('/persons/1');

这是我为了证明其用法而编造的一个小小提琴.