изменить url без перенаправления с помощью javascript [дубликат]

этот вопрос уже есть ответ здесь:

  • Измените URL-адрес без перезагрузки страницы 18 ответов

Я хотел бы знать, как изменить url без перенаправления, как на этом сайте http://dekho.com.pk/ads-in-lahore когда мы нажимаем на вкладки, url-адрес изменяется, но страница dosent перезагружается полностью. Есть другие вопросы по stackoverflow, указывающие на то, что это невозможно, но я хотел бы знать, как вышеупомянутый веб-сайт реализовал его. Спасибо

2 52
javascript jquery redirect ajax

2 ответа:

использовать pushState:

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

если вы хотите точно знать, что они используют, это костяк.js (смотри строки 4574 и 4981). Все это смешивается там с источником jQuery, но это соответствующие строки аннотированный Backbone.Router источник документация страницы:

The проверяет поддержку:

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

The :

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;
},

выбирая между хэш и нажимаем государство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);
}​

подробнее о том, что они делают:

// 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();

и 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);
}

вы должны прочитать аннотированный позвоночника.Яш ссылку я дал вверху. Очень информативный.

7