javascript Backbone.js 和 pushState
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9328513/
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
Backbone.js and pushState
提问by marcus
If I enable pushState in the backbone router, do I need to use return false on all links or does backbone handle this automatically? Is there any samples out there, both the html part and the script part.
如果我在主干路由器中启用 pushState，是否需要在所有链接上使用 return false 或主干是否自动处理？是否有任何示例，包括 html 部分和脚本部分。
回答by ggozad
This is the pattern Tim Branyen uses in his boilerplate:
这是 Tim Branyen 在他的样板文件中使用的模式：
initializeRouter: function () {
Backbone.history.start({ pushState: true });
$(document).on('click', 'a:not([data-bypass])', function (evt) {
var href = $(this).attr('href');
var protocol = this.protocol + '//';
if (href.slice(protocol.length) !== protocol) {
evt.preventDefault();
app.router.navigate(href, true);
}
});
}
Using that, rather than individually doing preventDefault on links, you let the router handle them by default and make exceptions by having a data-bypassattribute. In my experience it works well as a pattern. I don't know of any great examples around, but trying it out yourself should not be too hard. Backbone's beauty lies in its simplicity ;)
使用它，而不是单独对链接执行 preventDefault ，您让路由器默认处理它们并通过具有data-bypass属性来进行例外处理。根据我的经验，它可以很好地作为一种模式。我不知道周围有什么很好的例子，但自己尝试一下应该不会太难。Backbone 的美在于它的简单性 ;)
回答by mynameistechno
$(document.body).on('click', 'a', function(e){
e.preventDefault();
Backbone.history.navigate(e.currentTarget.pathname, {trigger: true});
});
回答by masakielastic
match()or startsWith()(ES 6) also can be used for checking protocol. If you want to support absolute urls by pathnameproperty, check the base urls by location.origin.
match()或startsWith()(ES 6) 也可用于检查协议。如果您想按pathname属性支持绝对网址，请检查基本网址location.origin。
function(evt) {
var target = evt.currentTarget;
var href = target.getAttribute('href');
if (!href.match(/^https?:\/\//)) {
Backbone.history.navigate(href, true);
evt.preventDefault();
}
// or
var protocol = target.protocol;
if (!href.startsWith(protocol)) {
// ...
}
// or
// http://stackoverflow.com/a/25495161/531320
if (!window.location.origin) {
window.location.origin = window.location.protocol
+ "//" + window.location.hostname
+ (window.location.port ? ':' + window.location.port: '');
}
var absolute_url = target.href;
var base_url = location.origin;
var pathname = target.pathname;
if (absolute_url.startsWith(base_url)) {
Backbone.history.navigate(pathname, true);
evt.preventDefault();
}
}
回答by Sunil Kumar
You can prevent the default behavior of click on <a>tags in html. Just add the below code inside <script />tag.
您可以防止<a>在 html中点击标签的默认行为。只需在<script />标签内添加以下代码即可。
<script>
$(document).on("click", "a", function(e)
{
e.preventDefault();
var href = $(e.currentTarget).attr('href');
router.navigate(href, true);router
});
</script>
