web-dev-qa-db-fra.com

Pouvez-vous utiliser la navigation par hachage sans affecter l'historique?

Je crains que cela ne soit impossible mais existe-t-il un moyen de modifier la valeur de hachage d'une URL sans laisser d'entrée dans l'historique du navigateur et sans rechargement ? Ou faire l'équivalent?

En ce qui concerne les détails, je développais une navigation de hachage de base le long des lignes de:

//hash nav -- works with js-tabs
var getHash = window.location.hash;
var hashPref = "tab-";
function useHash(newHash) {
    //set js-tab according to hash
    newHash = newHash.replace('#'+hashPref, '');
    $("#tabs li a[href='"+ newHash +"']").click();
}
function setHash(newHash) {
    //set hash according to js-tab
    window.location.hash = hashPref + newHash;

    //THIS IS WHERE I would like to REPLACE the location.hash
    //without a history entry

}
    // ... a lot of irrelavent tabs js and then....

    //make tabs work
    $("#tabs.js-tabs a").live("click", function() {
        var showMe = $(this).attr("href");
        $(showMe).show();
        setHash(showMe);
        return false;
    });
    //hash nav on ready .. if hash exists, execute
    if ( getHash ){
        useHash(getHash);
    }

En utilisant jQuery, évidemment. L'idée est que dans ce cas spécifique 1) faire revenir l'utilisateur sur chaque changement d'onglet pourrait effectivement "casser le bouton de retour" en empilant des références inutiles, et 2) ne pas conserver quel onglet il 're actuellement allumé s'ils frappent le rafraîchissement est une gêne.

javascriptjquerybrowser-historyfragment-identifierbrowser-state
94
D_N

location.replace("#hash_value_here"); a bien fonctionné pour moi jusqu'à ce que je trouve que cela ne fonctionne pas sur IOS Chrome. Dans ce cas, utilisez:

history.replaceState(undefined, undefined, "#hash_value")

history.replaceState () fonctionne exactement comme history.pushState () sauf que replaceState () modifie l'entrée d'historique actuelle au lieu d'en créer une nouvelle.

N'oubliez pas de conserver le # ou la dernière partie de l'URL sera modifiée.

84
Lucia
location.replace("#hash_value_here");

Ce qui précède semble faire ce que vous recherchez.

94
Matt

Edit: Cela fait maintenant quelques années, et les navigateurs ont évolué.

@ Luxiyalu's réponse est la voie à suivre

- Ancienne réponse -

Moi aussi je pense que c'est impossible (en ce moment). Mais pourquoi devez-vous modifier la valeur de hachage si vous ne comptez pas l'utiliser?

Je crois que la principale raison pour laquelle nous utilisons la valeur de hachage en tant que programmeurs est de laisser l'utilisateur mettre en signet nos pages, ou d'enregistrer un état dans l'historique du navigateur. Si vous ne voulez rien faire, enregistrez simplement l'état dans une variable et travaillez à partir de là.

Je pense que la raison d'utiliser un hachage est de travailler avec une valeur hors de notre contrôle. Si vous n'en avez pas besoin, cela signifie probablement que vous avez tout sous votre contrôle, alors stockez simplement l'état dans une variable et travaillez avec. (J'aime me répéter)

J'espère que cela vous aide. Il existe peut-être une solution plus simple à votre problème.

MISE À JOUR: Que diriez-vous de ceci:

  1. Configurez un premier hachage et assurez-vous qu'il est enregistré dans l'historique du navigateur.
  2. Lorsqu'un nouvel onglet est sélectionné, faites window.history.back(1), cela fera revenir l'historique à partir de votre premier hachage init.
  3. Maintenant que vous définissez le nouveau hachage, le tabulation ne fera qu'une seule entrée dans l'historique.

Vous devrez probablement utiliser des indicateurs, pour savoir si l'entrée actuelle peut être "supprimée" en revenant en arrière, ou si vous sautez simplement la première étape. Et pour vous assurer que votre méthode de chargement pour le "hachage" ne s'exécute pas lorsque vous forcez le history.back.

6
guzart