Anchors in links

Question

Given:

• Tom — who has a modern browser which is pushState-enabled
• Fred — who has a browser which is not pushState-enabled
• a super.app web application powered by Backbone

Tom browses to products/1 page where a #special-offer section exists.

Does Backbone allow Tom to share a link with Fred including the anchor to the special-offer section: http://super.app/products/1#special-offer

Will Fred be redirected to http://super.app/#products/1 (eg: without the #special-offer)?

In other words, does Backbone allow to use anchors?

Answer 1

I had a test here http://bl.ocks.org/abernier/raw/3183257/

It appears that YES:

• anchors can be used with pushState-enabled browsers : http://bl.ocks.org/abernier/raw/3183257/product1.html#special-offer
• while for IE<10, it is converted to http://bl.ocks.org/abernier/raw/3183257/#product1.html eg: without #special-offer

The only thing I had to take care about was to disable anchors for hashes-based history browsers, by:

if (!Backbone.history._hasPushState) {
  $('body').delegate('a[href^=#]', 'click', function (e) {
    e.preventDefault();
  });
}

Answer 2

Backbone has a very customizable use of hash URL fragments within its modules Router and History.