javascript 看不懂 History.js,需要简化吗?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7369043/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can't understand History.js, need it simplified?
提问by Peter
I'm fairly new to programming, and I'm making an AJAX site with the help of jQuery.
我对编程还很陌生,我正在 jQuery 的帮助下制作一个 AJAX 站点。
I've looked around a fair bit for an AJAX history handler, and figured that History.js seems to be the best/most up-to-date.
我环顾四周寻找 AJAX 历史处理程序,并认为 History.js 似乎是最好的/最新的。
My menu buttons each have their own unique ID's (#homeBtn, #featuresBtn, #pricingBtn), and currently look like this:
我的菜单按钮每个都有自己唯一的 ID(#homeBtn、#featuresBtn、#pricingBtn),目前看起来像这样:
<a href="#home" class="homeMainMenuButton" id="homeBtn"><div class="homeMainMenuButtonText">Home</div></a>
<a href="#home" class="homeMainMenuButton" id="homeBtn"><div class="homeMainMenuButtonText">Home</div></a>
Can someone give me an example (preferably on jsfiddle) on how I would implement History.js?
有人能给我一个关于如何实现 History.js 的例子(最好是在 jsfiddle 上)?
I can't seem to grasp any of the examples given by the author, and I simply need a dumbed down version =b
我似乎无法掌握作者给出的任何示例,我只需要一个简化版 =b
If you need any more information, please let me know, and thanks!
如果您需要更多信息,请告诉我,谢谢!
回答by balupton
Follow the instructions here: https://github.com/browserstate/ajaxify
按照此处的说明操作:https: //github.com/browserstate/ajaxify
Change your links to traditional links href="#home"
to href="/home"
- make sure http://mywebsite.com/home
works. This is all about graceful up-gradation.
将您的链接更改为传统链接href="#home"
以href="/home"
确保http://mywebsite.com/home
有效。这都是关于优雅的升级。
回答by aknuds1
I think the "dumbed down" version you need is a router abstraction. I've written a simple one for my own purposes, called StateRouter.js. It basically takes care of directing URLs supported by your application to the correct functions, you can even define parameter parts of routes (so that e.g. the 'id' part of http://example.com/persons/idbecomes a function parameter).
我认为您需要的“简化”版本是路由器抽象。我为自己的目的编写了一个简单的,称为StateRouter.js。它基本上负责将您的应用程序支持的 URL 定向到正确的函数,您甚至可以定义路由的参数部分(例如http://example.com/persons/id的“id”部分成为函数参数) .
This simple example code should demonstrate how it's used:
这个简单的示例代码应该演示它是如何使用的:
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');
Here's a little fiddleI've concocted in order to demonstrate its usage.
这是我编造的一个小小提琴,以演示它的用法。