Question

Je l'ai essayé une nouvelle façon de mettre en place un site Web en utilisant jQuery pour obtenir dynamiquement le contenu quand un lien est cliqué. Voici le code jQuery:

$(document).ready(function() {

 var content_loader = $('#content-loader');

 $('#nav ul li a').click(function () {
  $(this).closest('ul').find('li.active').removeClass('active');
  $(this).parent().addClass('active');
  content_loader.load('content/' + $(this).attr('data-name') + '.html'); 
  });

 content_loader.load('content/home.html');

});

Je l'ai fait de cette façon depuis que j'ai une chanson en arrière-plan de mon site que je veux jouer tout le temps et ne pas recommencer à chaque fois qu'un lien est cliqué.

L'ensemble fonctionne assez bien, sauf pour les 2 questions que je vais avoir.

  1. Disons que je clique sur le lien Contactez-nous. Je voudrais maintenant voir #contactus à la fin de l'URL. Si je puis actualisez la page, je vois encore mon contenu de la page d'accueil.
  2. Même problème si j'essaie lier quelqu'un à ma page contactez-nous.

Je me demandais si jQuery peut en quelque sorte savoir ce qui vient après le signe # dans l'URL. Dans ce cas, je peux changer la dernière ligne de mon code jQuery à la charge qu'au lieu des données à la maison tout le temps.

Était-ce utile?

La solution

window.location.hash contiendra la valeur après le hachage (s'il y en a un). (Ceci est quand il y a un hachage dans l'URL en cours, par exemple la page en cours., Dans la barre d'adresse du navigateur.)

Dans le cas contraire, si vous lisez un lien à partir d'un href, vous aurez besoin d'utiliser indexOf('#') et un peu d'analyse syntaxique.

Autres conseils

Merci pour vos réponses les gars. Voici comment je l'ai fait maintenant:

$(document).ready(function() {

    var content_loader = $('#content-loader');

    $('#nav ul li a').click(function () {
        $(this).closest('ul').find('li.active').removeClass('active');
        $(this).parent().addClass('active');
        content_loader.load('content/' + $(this).attr('href').slice(1) + '.html');  
        });

    var initial = 'home';
    if (window.location.hash) {
        initial = window.location.hash.slice(1);
        }

    $('#nav').find('a[href="#' + initial + '"]').parent('li').addClass('active');
    content_loader.load('content/' + initial + '.html');

    });
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top