422 votes

Comment supprimer le hachage de window.location avec JavaScript sans actualisation de la page?

Donc, si j'ai http://example.com#something , comment puis-je supprimer #something , sans provoquer l'actualisation de la page?

J'ai tenté la solution suivante:

 window.location.hash = '';
 

Cependant, cela ne supprime pas le symbole de hachage # de l'URL.

681voto

Andy E Points 132925

La résolution de ce problème est beaucoup plus accessible de nos jours. Le HTML5 Histoire de l'API nous permet de manipuler la barre de navigation pour afficher les URL dans le domaine actuel.

function removeHash () { 
    history.pushState("", document.title, window.location.pathname
                                                       + window.location.search);
}

Travail de démonstration: http://jsfiddle.net/AndyE/ycmPt/show/

Cela fonctionne dans Chrome 9, Firefox 4, Safari 5, Opera 11.50 et dans IE 10. Pour les non prise en charge des navigateurs, vous pouvez toujours écrire un gracieusement dégradant script qui permet d'utiliser, le cas échéant:

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

De sorte que vous pouvez vous débarrasser du symbole dièse, mais pas dans tous les navigateurs.

Remarque: si vous souhaitez remplacer la page actuelle dans l'historique du navigateur, utilisez replaceState() au lieu de pushState().

243voto

Gabriel Hurley Points 17079

La question initiale:

window.location.href.substr(0, window.location.href.indexOf('#'))

ou

window.location.href.split('#')[0]

les deux seront de retour l'URL sans le hachage ou quoi que ce soit après.

En ce qui concerne votre edit:

Tout changement d' window.location sera le déclencheur d'une actualisation de la page. Vous pouvez modifier window.location.hash sans déclenchement de l'actualisation (bien que la fenêtre va sauter si votre hachage correspond à un id sur la page), mais vous ne pouvez pas vous débarrasser de la dièse. Faites votre choix, pour ce qui est pire...

0voto

Vishal Sharma Points 37

Avez-vous essayé le ci-dessous?

 window.history.back(1);
 

-5voto

Devang Bhagdev Points 83

Vous pouvez remplacer le hachage par null

 var urlWithoutHash = document.location.href.replace(location.hash , "" );
 

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X