kostenloser Webspace werbefrei: lima-city

Browser Adresse ändern, ohne neue Seite zu laden - wie

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   limabone

   

   limabone hat kostenlosen Webspace.

   21:01, 28.4.2011

   Hallo,
   ich hab mich schon immer gefragt, wie man es anstellt, die Browser Url zu ändern, ohne eine andere Seite zu laden. Facebook hat das früher bei der alten Bilderanzeige gemacht. Ich fand das ganz praktisch, da die Bilder per AJAX einfach ersetzt wurden, und oben in der Adressleiste sich die Adresse mitverändert hat, ohne dass neu geladen wurde...
   Nochmal etwas simpler erklärt

   example.com/page.php?id=123

   ändern in zb

   exaample.com/page.php?id=234

   (muss nicht zwangsläufig ein wert dadurch übermittelt werden, ich würde nur wollen, falls der benutzer die Seite mit f5 neulädt, sie genauso angezeigt wird, wie vorher, trotz AJAX Content..)
   Ich stellte mir das so vor, wenn man bei Meiner Webseite auf zB: Chemie klickt, dass oben einfach

   http://www.mytestmedia.com/documents/categories

   in

   http://www.mytestmedia.com/documents/categories/chemie

   geändert wird.
   Danke für die Antworten
   
   Beitrag zuletzt geändert: 28.4.2011 21:02:53 von limabone

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. fabo

   fabo hat kostenlosen Webspace.

   21:05, 28.4.2011

   Die arbeiten nur mit Ankern d.h. es ändert sich eigentlich nichts an der URL.
   
   

   window.location.hash = 'chemie';

   
   
   Simples Beispiel
   
   EDIT:
   
   Mit HTML5 wird so etwas standardmäßig möglich sein. Siehe z.B. http://spoiledmilk.dk/blog/html5-changing-the-browser-url-without-refreshing-page
   
   Ganze Container mit komplett neuem Inhalt zu füllen ist aber auch mit Ajax kein Problem.
   
   Beitrag zuletzt geändert: 28.4.2011 21:11:49 von fabo
4. Autor dieses Themas

   limabone

   

   limabone hat kostenlosen Webspace.

   21:20, 28.4.2011

   Jetzt wo ich weiß, wonach ich suchen muss, habe ich auch diesen netten Beitrag (sogar auf Deutsch ) gefunden. Darin wird das ganze über den Hash (ohne den Hack) über #!/var1/var2 aufgerufen. Ich erkundige mich aber noch genauer. Danke dir auf jeden Fall für die schnelle Antwort
   
   EDIT: So nun ist es mal schnell hingebastelt und funktioniert auch schon. Wenn man nun irgendeine Kategorie anklickt, wird zuerst mit

   window.location.hash("xyz");

   ein Hash in der Adressleiste gespeichert. Wenn man nun (irrtümlich oder mit Absicht) f5 drückt oder den Browser aktualisiert ber Knopf, dann wird über

   if(window.location.hash!='') {
     var hash = window.location.hash;
     hash = hash.replace(/#/g, '');
     $('#sb').load('ordner/geheim.php/?id='+hash);
    }

   einfach der passende Inhalt per AJAX nochmal geladen, bei dem neuen Seitenaufruf.
   Problem wurde gelöst (bzw. Frage beantwortet ) Klasse, danke nochmals.
   
   Beitrag zuletzt geändert: 28.4.2011 22:22:54 von limabone

5. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?