Comment supprimer le hachage de window.location (URL) avec JavaScript sans actualisation de page?

J'ai une URL comme:, http://example.com#somethingcomment supprimer #something, sans provoquer le rafraîchissement de la page?

J'ai tenté la solution suivante:

window.location.hash = '';

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

Question initiale:

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

ou

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

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

En ce qui concerne votre montage:

Toute modification window.locationentraînera une actualisation de la page. Vous pouvez modifier window.location.hashsans déclencher l'actualisation (bien que la fenêtre saute si votre hachage correspond à un identifiant sur la page), mais vous ne pouvez pas vous débarrasser du signe de hachage. Faites votre choix pour ce qui est pire ...

RÉPONSE LA PLUS ACTUELLE

La bonne réponse sur la façon de le faire sans sacrifier (soit un rechargement complet ou en laissant le signe de hachage là-bas) est ici . Laissant cette réponse ici par rapport à l'original en 2009 alors que la bonne qui utilise les nouvelles API de navigateur a été donnée 1,5 an plus tard.

De nos jours, résoudre ce problème est beaucoup plus à portée de main. L' API Historique HTML5 nous permet de manipuler la barre d'adresse pour afficher n'importe quelle URL dans le domaine actuel.

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

Démo de travail: http://jsfiddle.net/AndyE/ycmPt/show/

Cela fonctionne dans Chrome 9, Firefox 4, Safari 5, Opera 11.50 et dans IE 10. Pour les navigateurs non pris en charge, vous pouvez toujours écrire un script dégradant gracieusement qui l'utilise lorsqu'il est disponible:

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

Vous pouvez donc vous débarrasser du symbole de hachage, mais pas dans tous les navigateurs - pour le moment.

_{Remarque: si vous souhaitez remplacer la page actuelle dans l'historique du navigateur, utilisez replaceState()plutôt que pushState().}

(Trop de réponses sont redondantes et obsolètes.) La meilleure solution est la suivante:

history.replaceState(null, null, ' ');

Simple et élégant:

history.replaceState({}, document.title, ".");  // replace / with . to keep url

Pour supprimer le hachage, vous pouvez essayer d'utiliser cette fonction

function remove_hash_from_url()
{
    var uri = window.location.toString();
    if (uri.indexOf("#") > 0) {
        var clean_uri = uri.substring(0, uri.indexOf("#"));
        window.history.replaceState({}, document.title, clean_uri);
    }
}

Cela supprimera également le hachage de fin. par exemple: http://test.com/123#abc -> http://test.com/123

if(window.history.pushState) {
    window.history.pushState('', '/', window.location.pathname)
} else {
    window.location.hash = '';
}

Et les choses suivantes?

window.location.hash=' '

Veuillez noter que je mets le hachage sur un seul espace et non sur une chaîne vide.

La définition du hachage sur une ancre non valide ne provoque pas non plus d'actualisation. Tel que,

window.location.hash='invalidtag'

Mais, je trouve la solution ci-dessus trompeuse. Cela semble indiquer qu'il y a une ancre sur la position donnée avec le nom donné bien qu'il n'y en ait pas. Dans le même temps, l'utilisation d'une chaîne vide entraîne le déplacement de la page vers le haut, ce qui peut parfois être inacceptable. L'utilisation d'un espace garantit également que chaque fois que l'URL est copiée, mise en signet et visitée à nouveau, la page sera généralement en haut et l'espace sera ignoré.

Et, hé, c'est ma première réponse sur StackOverflow. J'espère que quelqu'un le trouve utile et qu'il correspond aux normes de la communauté.

Vous pouvez le faire comme ci-dessous:

history.replaceState({}, document.title, window.location.href.split('#')[0]);

const url = new URL(window.location);
url.hash = '';
history.replaceState(null, document.title, url);

<script type="text/javascript">
var uri = window.location.toString();
if (uri.indexOf("?") > 0) {
    var clean_uri = uri.substring(0, uri.indexOf("?"));
    window.history.replaceState({}, document.title, clean_uri);
}
</script>

mettre ce code sur la section tête

function removeLocationHash(){
    var noHashURL = window.location.href.replace(/#.*$/, '');
    window.history.replaceState('', document.title, noHashURL) 
}

window.addEventListener("load", function(){
    removeLocationHash();
});

Je pense que ce serait plus sûr

if (window.history) {
    window.history.pushState('', document.title, window.location.href.replace(window.location.hash, ''));
} else {
    window.location.hash = '';
}

Essayez ce qui suit:

window.history.back(1);

Voici une autre solution pour modifier l'emplacement à l'aide de href et effacer le hachage sans faire défiler.

La solution magique est expliquée ici . Spécifications ici .

const hash = window.location.hash;
history.scrollRestoration = 'manual';
window.location.href = hash;    
history.pushState('', document.title, window.location.pathname);

REMARQUE: l'API proposée fait maintenant partie de WhatWG HTML Living Standard

  $(window).on('hashchange', function (e) {
        history.replaceState("", document.title, e.originalEvent.oldURL);
    });

Vous pouvez remplacer le hachage par null

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