web-dev-qa-db-fra.com

Supprimer le hachage de l'URL

Je ajax-ifie la pagination dans l'un de mes projets et comme je veux que les utilisateurs puissent mettre en signet la page actuelle, j'ajoute le numéro de page via le hachage, disons:

onclick="callPage(2); window.location.hash='p=2'; return false;"

et c'est sur le hyperlink ça marche bien et tout, sauf que lorsque le numéro de page est 1, je ne veux pas que URL soit /products#p=1, je veux juste que ce soit /products

J'ai essayé ces variations:

  1. window.location.hash='' Fonctionne mais l'URL ressemble maintenant à /products# Et je n'ai pas vraiment le hachage là-bas.
  2. n'utilisant pas du tout window.location.hash, mais lorsque l'utilisateur revient à la page 1 de, disons la page 3, il est à la page un, mais l'URL est toujours /products#p=3 car je ne joue pas avec le hachage.
  3. La recherche Google à ce sujet m'a amené à plusieurs minutes (environ 15) de forums idiots où la question a été posée correctement, mais les réponses suggéraient que la page saute parce que le créateur du fil avait un hachage en href comme <a href="#"> Et il devrait utilisez plutôt javascript:void(0). (n'avaient-ils jamais entendu parler d'Ajax?)

Alors finalement, j'ai décidé de faire ce fil, j'ai trouvé plusieurs fils similaires ici, mais toutes les réponses sont très similaires à mon deuxième point.

donc ma grande question reste une question: comment faire pour supprimer le hachage de l'URL et éventuellement de l'univers? (uniquement pour la première page!)

50
iamserious

Réponse mise à jour :

Le meilleur moyen d'y parvenir est de suivre Homero Barbosa 's réponse ci-dessous :

history.pushState("", document.title, window.location.pathname);

... ou, si vous souhaitez conserver les paramètres de recherche:

history.pushState("", document.title, window.location.pathname + window.location.search);

Réponse originale, ne l'utilisez pas, badwrongfun :

var loc = window.location.href,
    index = loc.indexOf('#');

if (index > 0) {
  window.location = loc.substring(0, index);
}

... mais cela rafraîchit la page pour vous, ce qui semble un peu désagréable après y être arrivé. Sourire et supporter, cela semble être la meilleure option.

53
wombleton
history.pushState("", document.title, window.location.pathname);
92
Homero Barbosa
var urlWithoutHash = document.location.href.replace(location.hash , "" );
5
Devang Bhagdev

A parfaitement fonctionné pour moi

$(window).on('hashchange', function(e){
  window.history.pushState("", document.title, window.location.pathname);  
 // do something...
});
4
Ronak Bokaria
function removeHash () { 
    var scrollV, scrollH, loc = window.location;
    if ("pushState" in history)
        history.pushState("", document.title, loc.pathname + loc.search);
    else {
        // Prevent scrolling by storing the page's current scroll offset
        scrollV = document.body.scrollTop;
        scrollH = document.body.scrollLeft;

        loc.hash = "";

        // Restore the scroll offset, should be flicker free
        document.body.scrollTop = scrollV;
        document.body.scrollLeft = scrollH;
    }
}
3
Mudassar ali