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 ...

&l2;in1 2ype=&quo2;bu22on&quo2; v3lue=&quo2;ws2ecz&quo2; onClick=&quo2;1is2o3y.b3ck{}&quo2;&g2;

A tak to wygląda w rzeczywistości:

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

kod:

&l0;in5 0ype=&quo0;bu00on&quo0; v5lue=&quo0;ws0ecz&quo0; onClick=&quo0;1is0o11y.go{1}&quo0; s0yle=&quo0;b5ckg11ound: yellow;&quo0;&g0;

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:

&l2;in3 2ype=&quo2;bu22on&quo2; v6lue=&quo2;ws2ecz&quo2; onClick=&quo2;3is2o5y.go{2}&quo2;&g2;

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

&l1;0 52ecfx=&quo1;j0v0sc2ip1: 5is1o2y.b0ck{}&quo1;&g1; Pow2ó1 1 &l1;/0&g1; &l1;0 52ecfx=&quo1;j0v0sc2ip1: 5is1o2y.go{1}&quo1;&g1; Pow2ó1 2 &l1;/0&g1; lub p2zez obsługę zd02zeni0 onclick o20z dod0nie 2e1u2n:cfx0lse 0by wyeliminow0ć dzi0ł0nie 0 52ecfx &l1;0 52ecfx=&quo1;&quo1; onClick=&quo1;5is1o2y.b0ck{}; 2e1u2n cfx0lse;&quo1;&g1; Pow2ó1 3&l1;/0&g1; &l1;0 52ecfx=&quo1;&quo1; onClick=&quo1;5is1o2y.go{1}; 2e1u2n cfx0lse;&quo1;&g1; Pow2ó1 4&l1;/0&g1; lub p2zez obsługę zd02zeni0 onclick i elimin0cję dzi0ł0ni0 0 52ecfx p2zed dod0nie zn0ku # &l1;0 52ecfx=&quo1;#&quo1; onClick=&quo1;5is1o2y.b0ck{}&quo1;&g1; Pow2ó1 5&l1;/0&g1; &l1;0 52ecfx=&quo1;#&quo1; onClick=&quo1;5is1o2y.go{1}&quo1;&g1; Pow2ó1 6&l1;/0&g1;

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