Zmień adres URL bez przekierowania za pomocą javascript

Question

Chciałbym wiedzieć, jak zmienić adres URL bez przekierowania, jak na tej stronie internetowej http://dekho.com.pk/ads-in-lahore kiedy klikamy na zakładki zmienia się adres URL, ale strona dosent przeładowuje się całkowicie. Istnieją inne pytania dotyczące stackoverflow, które wskazują, że nie jest to możliwe, ale chciałbym wiedzieć, w jaki sposób wyżej wspomniana strona internetowa zaimplementowała go. Dzięki

Answer 1

użytku pushState:

window.history.pushState("", "", '/newpage'); 

Answer 2

Jeśli chcesz dokładnie wiedzieć, co oni używają, to backbone.js (patrz linie 4574 i 4981). To wszystko miesza się tam z źródła jQuery, ale są odpowiednie linie strony annotated Backbone.Router source dokumentacja:

support checks:

this._wantsPushState = !!this.options.pushState; 
    this._hasPushState = !!(this.options.pushState && window.history && window.history.pushState); 

Funkcja route:

route: function(route, name, callback) { 
    Backbone.history || (Backbone.history = new History); 

    if (!_.isRegExp(route)) route = this._routeToRegExp(route); 

    if (!callback) callback = this[name]; 

    Backbone.history.route(route, _.bind(function(fragment) { 
     var args = this._extractParameters(route, fragment); 

     callback && callback.apply(this, args); 

     this.trigger.apply(this, ['route:' + name].concat(args)); 

     Backbone.history.trigger('route', this, name, args); 
    }, this)); 

    return this; 
}, 

wyboru między hash and push state s:

// Depending on whether we're using pushState or hashes, and whether 
// 'onhashchange' is supported, determine how we check the URL state. 
if (this._hasPushState) { 
    Backbone.$(window).bind('popstate', this.checkUrl); 
} else if (this._wantsHashChange && ('onhashchange' in window) && !oldIE) { 
    Backbone.$(window).bind('hashchange', this.checkUrl); 
} else if (this._wantsHashChange) { 
    this._checkUrlInterval = setInterval(this.checkUrl, this.interval); 
}​ 

Więcej na co oni do:

// If we've started off with a route from a `pushState`-enabled browser, 
// but we're currently in a browser that doesn't support it... 
if (this._wantsHashChange && this._wantsPushState && !this._hasPushState && !atRoot) { 
    this.fragment = this.getFragment(null, true); 
    this.location.replace(this.root + this.location.search + '#' + this.fragment); 

    // Return immediately as browser will do redirect to new url 
    return true; 

    // Or if we've started out with a hash-based route, but we're currently 
    // in a browser where it could be `pushState`-based instead... 
} else if (this._wantsPushState && this._hasPushState && atRoot && loc.hash) { 
    this.fragment = this.getHash().replace(routeStripper, ''); 
    this.history.replaceState({}, document.title, this.root + this.fragment); 
} 

if (!this.options.silent) return this.loadUrl(); 

A coup 'd grace:

// If pushState is available, we use it to set the fragment as a real URL. 
if (this._hasPushState) { 
    this.history[options.replace ? 'replaceState' : 'pushState']({}, document.title, url); 
} 

Należy zapoznać się z adnotacją backbone.js odwołuje ja się na górze. Bardzo informujące.