骨干路由器导航和锚的href [英] Backbone Router navigate and anchor href

问题描述

在启用骨干网应用程序，我已经看到了code继续通过＆LT; A HREF =＃富＆GT;＆LT; / A＆GT; ，而锚点击由骨干事件处理程序处理。

In a backbone-enabled app, I have seen code that continues to use <a href="#foo"></a>, while the anchor click is handled by a backbone event handler.

另外，导航#foo可以进行处理：

Alternatively, the navigation to #foo can be handled by:

Router.history.navigate("foo");

我相信后者是优越的方法，因为它可以轻松移植到和HTML5的pushState的功能。而如果我们使用pushState的，骨干将能够适度地降低到#foo为不支持pushState的浏览器。

I believe the latter is the superior approach because it allows easy migration to and from HTML5's pushState functionality. And if we do use pushState, Backbone would be able to gracefully degrade to #foo for browsers that do not support pushState.

由于我还是新的骨干，可以更有经验的人，有学问证实，这种情况？

As I am still new to Backbone, can someone more experienced and knowledgable confirm that this is the case?

推荐答案

我个人 pushState的启用并使用的并称将所有链接点击到>导航，除非他们有一个数据旁路属性：

I personally have pushState enabled and use the approach taken in Tim Branyen's backbone-boilerplate of adding a click handler that sends all link clicks to navigate unless they have a data-bypass attribute:

$(document).on("click", "a:not([data-bypass])", function(evt) {
  var href = { prop: $(this).prop("href"), attr: $(this).attr("href") };
  var root = location.protocol + "//" + location.host + Backbone.history.options.root;

  if (href.prop && href.prop.slice(0, root.length) === root) {
    evt.preventDefault();
    Backbone.history.navigate(href.attr, true);
  }
});

这工作pretty以及和@nickf提到了，你不必使用散列/ hashbang黑客，甚至不支持pushState的浏览器的优势。

This works pretty well and as @nickf mentions has the advantage that you don't have to use the hash/hashbang hack, even for browsers that do not support pushState.

这篇关于骨干路由器导航和锚的href的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！