web-dev-qa-db-fra.com

Changer l'URL dans la barre d'adresse du navigateur sans recharger la page existante

Duplicata possible:
Modifier l'URL sans recharger la page

Je cherche un moyen de rendre mes liens internes fonctionnels en utilisant mes animations javascript actuelles, sans provoquer le rechargement de la page lorsque vous cliquez dessus - mais je voudrais que l'URL soit mise à jour dans le navigateur .

De nombreux sites Web le font, voici un bon exemple: http://grooveshark.com/#!/search?q=adf

Comment obtiennent-ils l'URL à mettre à jour sans recharger la page?

Plus de détails:

Actuellement, un lien sur ma page ressemble à <a href="#aboutus">About Us</a>, cela vous amène à <div id="aboutus"></div> via javascript.

Le javascript ressemble à quelque chose comme:

$("#navigation a").click(function(e){
  animate(..scroll to section..);
  e.preventDefault(); // <==========
});

Je crois que le "e.preventDefault ()" est ce qui empêche l'URL d'être mise à jour, mais comment empêcher le navigateur de recharger la page lorsque l'URL est modifiée?

Comment les autres sites Web procèdent-ils? Comment appelle-t-on cette méthode (pour que je puisse la poursuivre)?

merci.

javascripthtmlurl
28
Radley Sustaire

Voici une question similaire .

Voici un exemple:

function processAjaxData(response, urlPath){
    document.getElementById("content").innerHTML = response.html;
    document.title = response.pageTitle;
    window.history.pushState(
        {
            "html":response.html,
            "pageTitle":response.pageTitle
        },
        "",
        urlPath
   );
}
24
Maziar Aboualizadehbehbahani

Il me semble que tout se fait avec AJAX. Le #! dans l'URL oblige le navigateur à interpréter le reste de l'URL comme une ancre - les ancres ne provoquent pas de rechargement de page (en fait, le serveur ne verra jamais sur quelle ancre se trouve le navigateur au cours d'un HTTP normal demande). Lorsque l'URL change, Javascript prend le relais, inspecte la chaîne de requête et charge tout ce qui est approprié depuis le serveur à l'aide des services Web.

Je ne l'ai pas trop regardé en profondeur, mais c'est à ça que ça ressemble pour moi.

2
Charlie Kilian