Avatar billede barklund Nybegynder
07. marts 2007 - 10:30 Der er 13 kommentarer og
2 løsninger

Fange historiknavigation efter fragment-link i js

Hejsa,

På et AJAX-baseret website lader jeg brugeren have mulighed for altid at kunne deeplinke til den side han kigger på, ved at opdatere fragment-delen af url'en.

Altså, klikker brugeren fra denne side:

http://example.com/page

På et link til artikel 1, så henter jeg artikel 1 via ajax og opdaterer url'en via js til:

http://example.com/page#article=1

Det gør, at siden ikke refresher, og samtidig kan brugeren til hver en tid kopiere eller bookmark'e url'en og rent faktisk vende tilbage til den samme side (da jeg ved nyt førstegangsbesøg fanger dette i js og håndterer det).

Udover denne fordel, så giver det faktisk også den fordel, at browserhistorikken tilføjes et punkt. Altså, at jeg kan klikke tilbage til siden uden denne "#article=1". Men hvordan kan jeg fange dette tilbage-klik? Og efterfølgende fremad-klik? Jeg kan sætte et interval, der kigger på location og råber højt, når fragment ændrer sig, men det er jo ikke interessant.

Hvordan lytter jeg på dette på den pæneste måde?

--
Morten Barklund
Avatar billede roenving Novice
07. marts 2007 - 10:34 #1
Hvad skal du bruge det til ?-)
Avatar billede barklund Nybegynder
07. marts 2007 - 10:56 #2
Opdatere siden selvfølgelig. Når brugeren klikker tilbage til #article=2 eller frem til #foo=bar, så skal jeg gøre det, der sker på den aktuelle side :)

--
Morten Barklund
Avatar billede roenving Novice
07. marts 2007 - 11:08 #3
Aha, du har links i historikken, men browseren reloader ikke ved klik på frem og tilbage ?-)

-- det lyder umiddelbart mærkeligt, har du et link ?o]

-- men ellers lyder det som en interval-ting i størrelsesordenen ½-1 sekund !-)
Avatar billede barklund Nybegynder
07. marts 2007 - 11:20 #4
Jeg kan da lige lave dig en test :)
Avatar billede barklund Nybegynder
07. marts 2007 - 11:47 #5
Meget simplificeret, men med alle de ovennævnte funktioner:

Og innerHTML er bare for at gøre det nemt - ikke produktionskode! :)

http://barklund.org/examples/fragment/

--
Morten Barklud
Avatar billede barklund Nybegynder
07. marts 2007 - 11:47 #6
Morten Barklund! (ikke godt at stave forkert til eget navn)
Avatar billede roenving Novice
07. marts 2007 - 12:01 #7
Nå, karklud, du skal vist lige have IE frem, før du kommer alt for meget længere ...
Avatar billede barklund Nybegynder
07. marts 2007 - 12:25 #8
Mindre detalje omkring tildeling af onclick - jeg bruger alligevel en attribut-abstraktionsmetode i den endelige applikation.

Og tilføjelsen til historikken sker kun, hvis der rent faktisk er noget, der har et id svarende til det brugte fragment, så alle dele virker også i IE nu :)

Bortset fra at jeg stadig skal fange historiknavigationen.

--
Morten Barklund
Avatar billede roenving Novice
07. marts 2007 - 12:40 #9
Jeg tror ikke, du kan finde andet end at teste den med interval ...
Avatar billede barklund Nybegynder
07. marts 2007 - 13:00 #10
Hm, jeg synes ikke engang at kunne tilgå history.current, så jeg kunne holde øje med den i stedet.

Så det må blive overvågning af location.hash og internt signalling-framework.
Avatar billede roenving Novice
07. marts 2007 - 13:15 #11
Nej, history-objektet kan du ikke fange noget fra, det kan alene bruges til navigation ...

Ifølge min reference findes current, next og previous kun til netscape 4 og 6, Mozilla og FireFox er ikke med, men tendensen har været, at al info i history-objektet er utilgængeligt f.eks. pga. muligheden for at tracke !-)
Avatar billede barklund Nybegynder
07. marts 2007 - 15:05 #12
Hm, nu har jeg lavet en lille FragWatcher-klasse. Ikke pænt, men det er da en mulighed.

Smid et svar for tips (eller primært for afvisning ;)), roenving :)

--
Morten Barklund
Avatar billede roenving Novice
08. marts 2007 - 00:48 #13
Oki *-)
Avatar billede barklund Nybegynder
08. marts 2007 - 08:00 #14
Vi deler lige :)
Avatar billede roenving Novice
08. marts 2007 - 13:42 #15
Tak for point ;~}
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester