Domanda

Ho cercato un nuovo modo di creare un sito web utilizzando jQuery per ottenere dinamicamente il contenuto quando un link viene cliccato. Ecco il codice 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');

});

ho fatto in questo modo dal momento che ho una canzone in sottofondo del mio sito che voglio giocare tutto il tempo e non ricominciare da capo ogni volta che un link viene cliccato.

Il tutto funziona abbastanza bene, tranne che per 2 problemi che sto avendo.

  1. Diciamo che clicco sul CONTATTI LINK. Vorrei ora vedere #contactus alla fine dell'URL. Se io quindi aggiornare la pagina, rivedo i miei contenuti home page.
  2. Stesso problema se provo collega qualcuno alla mia pagina contatti.

Mi chiedevo se jQuery può in qualche modo scoprire che cosa viene dopo il simbolo # nell'URL. In tal caso, posso cambiare l'ultima riga del mio codice jQuery per il carico che al posto dei dati casa tutto il tempo.

È stato utile?

Soluzione

window.location.hash conterrà il valore dopo l'hash (se ce n'è uno). (questo è quando c'è un hash nell'URL corrente, ad es. La pagina corrente, nella barra degli indirizzi del browser.)

In caso contrario, se stai leggendo un link da un href, è necessario utilizzare indexOf('#') e un po 'di analisi.

Altri suggerimenti

Grazie per le vostre risposte ragazzi. Ecco come ho fatto ora:

$(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');

    });
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top