Как заменить хэш местоположения и сохранить только последний элемент истории?

Я использую jQuery BBQ plug-in, чтобы отслеживать прогресс пользователей через страницу. Тем не менее, я хочу создать только одну запись в истории пользователя, а не для каждого изменения хэша.

Я пробовал методы jQuery.bbq.pushState и merge_mode без успеха: новые записи истории все еще добавлены:

jQuery.bbq.pushState({ sort: encodeURIComponent(sort) });

Я также пробовал location.replace(), но это не работает для Safari 5.1.2.

location.replace('#' + encodeURIComponent(sort))

Что такое кросс-браузерное решение для изменения хэша, не добавляя слишком много записей в историю?

Ответы

Ответ 1

Во-первых, я показываю определение функции replaceHash, которое принимает только один аргумент: новый хэш местоположения. Подробное объяснение логики можно найти в нижней части ответа.

код:

// Should be executed BEFORE any hash change has occurred.
(function(namespace) { // Closure to protect local variable "var hash"
    if ('replaceState' in history) { // Yay, supported!
        namespace.replaceHash = function(newhash) {
            if ((''+newhash).charAt(0) !== '#') newhash = '#' + newhash;
            history.replaceState('', '', newhash);
        }
    } else {
        var hash = location.hash;
        namespace.replaceHash = function(newhash) {
            if (location.hash !== hash) history.back();
            location.hash = newhash;
        };
    }
})(window);
// This function can be namespaced. In this example, we define it on window:
window.replaceHash('Newhashvariable');

Логика функций

  • Когда поддерживается history.replaceState, функция всегда будет заменять текущий хеш без каких-либо побочных эффектов.

  • В противном случае создается ссылка (hash) на самое первое свойство location.hash и определяется следующая функция:

    • Если location.hash != hash, то мы точно знаем, что состояние истории, по крайней мере, прошло за первой страницей. Мы можем безопасно вернуться в историю, не выгружая страницу. history.back(); // Go back in the history.
    • Затем установите свойство location.hash. Если мы вернемся в историю на предыдущем шаге, запись истории будет перезаписана.


    Метод возврата (последний) не всегда может заменить историю:
    Когда location.hash == hash, выполняется одно из следующих условий:

    • Хэш еще не изменился, поэтому нет смысла возвращаться к предыдущей странице.
    • Возможно, пользователь перешел назад, в исходное состояние страницы. Если мы используем history.back();, страница может быть выгружена, что нежелательно.


    Итак, чтобы быть безопасным, мы никогда не выгружаем страницу, когда хеш равен сохраненному исходному хэшу.

    Примечание. Важно выполнить этот код перед изменением хэша. Когда хэш уже был изменен, script больше не надежен. Пользователь мог перейти к самому первому состоянию хеширования, которое не равно сохраненному hash. Следовательно, history.back() выгружает страницу.

Ответ 2

Вы можете использовать replace -метод от window.location, без второго newSubStr -аргумента. Это работает во всех известных браузерах, даже oldIE:

function replaceHash(hash) {
  return window.location.replace(
    '#' + hash.replace(/^#/, '')
  );
}

Обратите внимание, что если в документе есть действительный элемент (в соответствии со спецификацией), страница будет перескакивать/прокручиваться до него.