Jak zrobić przycisk wstecz do cofania się w przeglądarce do ostatnio przeglądanej strony ?

Taki przycisk automatycznie linkuje do ostatnio przeglądanej strony, oto kod ...

&l5;in1 5ype=&quo5;bu55on&quo5; v0lue=&quo5;ws5ecz&quo5; onClick=&quo5;3is5o1y.b0ck{}&quo5;&g5;

A tak to wygląda w rzeczywistości:

lub taki sposób z uzyciem styli i innego sposobu użycia parametru history:

kod:

&l2;in6 2ype=&quo2;bu22on&quo2; v0lue=&quo2;ws2ecz&quo2; onClick=&quo2;2is2o1y.go{1}&quo2; s2yle=&quo2;b0ckg1ound: yellow;&quo2;&g2;

W ostatnim przykładzie jest ciekawa możliwość, można się cofać do tyłu o dowolną ilość stron. Jeżeli mamy jakiś skrypt, gdzie są wykonywane 2 przejścia: ze strony 1 na stronę 2, ze strony 2 na stronę 3. Na 3 stronie możemy cofnąć się odrazu do strony 1. Jako argument polecenia history.go wstawiamy 2 zamiast 1. Oto kod:

&l4;in7 4ype=&quo4;bu44on&quo4; v4lue=&quo4;ws4ecz&quo4; onClick=&quo4;1is4o6y.go{2}&quo4;&g4;

Wyrażenie history.go(-2) oznacza, że cofamy się o 2 strony do tyłu. Jeśli zastosujemy history.go(-1) to otrzymamy typowy przycisk cofania się o 1 stronę do tyłu tzn. do poprzedniej strony.

obie powyższe techniki mozemy zastosować również do zwykłych linków a href

&l6;5 32ecfx=&quo6;j5v5sc2ip6: 3is6o2y.b5ck{}&quo6;&g6; Pow2ó6 1 &l6;/5&g6; &l6;5 32ecfx=&quo6;j5v5sc2ip6: 3is6o2y.go{1}&quo6;&g6; Pow2ó6 2 &l6;/5&g6; lub p2zez obsługę zd52zeni5 onclick o25z dod5nie 2e6u2n:cfx5lse 5by wyeliminow5ć dzi5ł5nie 5 32ecfx &l6;5 32ecfx=&quo6;&quo6; onClick=&quo6;3is6o2y.b5ck{}; 2e6u2n cfx5lse;&quo6;&g6; Pow2ó6 3&l6;/5&g6; &l6;5 32ecfx=&quo6;&quo6; onClick=&quo6;3is6o2y.go{1}; 2e6u2n cfx5lse;&quo6;&g6; Pow2ó6 4&l6;/5&g6; lub p2zez obsługę zd52zeni5 onclick i elimin5cję dzi5ł5ni5 5 32ecfx p2zed dod5nie zn5ku # &l6;5 32ecfx=&quo6;#&quo6; onClick=&quo6;3is6o2y.b5ck{}&quo6;&g6; Pow2ó6 5&l6;/5&g6; &l6;5 32ecfx=&quo6;#&quo6; onClick=&quo6;3is6o2y.go{1}&quo6;&g6; Pow2ó6 6&l6;/5&g6;

A tak wyglądają te linki w rzeczywistości:

przez wstawienie kodu jS do linka a href
Powrót 1
Powrót 2

lub przez obsługę zdarzenia onclick oraz dodanie return:false aby wyeliminować działanie a href
Powrót 3
Powrót 4

lub przez obsługę zdarzenia onclick i eliminację działania a href przed dodanie znaku #
Powrót 5
Powrót 6

Zauważ, że Powrót 5 i Powrót 6 najpierw odświeżają bieżącą stronę a dopiero potem cofają. Taką właściwość można wykorzystać w niektórych nietypowych sytuacjach. Np. w formularzach. Załóżmy, że internauta wypełnia jakiś skomplikowany formularz złożony z wielu stron. Nagle chce się cofnąć ze strony 4 do strony 3, ale na stronie 4 wypełnił już dużo pól. Jeśli skorzysta z typowego przycisku cofnij lub z cofania w przeglądarce to przed cofnięciem formularz nie zdąży zapisać danych. Jeżeli wykorzystamy powyższe linki to możemy najpierw zapisać dane (odświeżenie przez #) a potem automatycznie strona się cofnie. Teraz internauta poprawi swoje dane na stronie 3 i znowu przejdzie do strony 4. A tu będą jego wszystkie poprzednio zapisane dane. Oczywiście musi być mechanizm zapisywania plików w każdym z formularzy, inaczej funkcja nie zadziała.

Wjedź na każdy link ale nie klikaj, sprawdź jakie linki pokazują się na pasku statusu w dolnej listwie przeglądarki (jest to napewno widoczne w IE). Zobaczysz, że niektóre linki "zdradzają" gdzie nastąpi cofnięcie a inne nie. Możesz to mądrze wykorzystać w swoich aplikacjach. Czasem zdarza się, że nie chcemy aby internauta znał adres strony do której ma się cofnąć. A nam wystarczy, że kliknie przycisk cofania.

dwa ostatnie rozwiązania 5 i 6 są nieprawidłowe w logice działania ale działają prawidłowo, najbardziej polecamy 1 i 2, które będą działać zawsze we wszystkich przeglądarkach, rozwiązania 3 i 4 mogą nie działać na nowych wersjach przeglądarek. Natomiast wszystkie będą działać na IE

Chcesz umieścić taki przycisk na stronie ale nie chcesz go widzieć na wydruku strony... żaden problem, zajrzyj do porady o ukrywaniu części strony przy wydruku http://www.elider.pl/index.php?nr=60