JavaScript を使って、ウェブサイト上にブラウザの「戻る」ボタンと同じリンクを設置する方法です。
たとえば、動作確認ページやDEMOページなど、コンテンツ量の少ないページは、内容を確認した後、「またすぐに元のページに戻りたい」というニーズが発生します。
そんなとき、サイト訪問者はブラウザの「戻る」ボタンをクリックするか、右クリックの「戻る」などを使って元のページに戻るでしょう。
しかしウェブページ内に『元のページに戻る』のようなボタンがあると、とても親切で便利です。
実装はわずか1行!
とても簡単です。
<a href="javascript:history.back();">前のページに戻る</a>
同じ処理をフォームのインプットボタンを使って実現する方法もあります。
<form> <input type="button" Value="前のページに戻る" onClick="history.go(-1);"> </form>
こちらは「onClick="history.go(-1);"
」の部分の (-1)
の数値を変えることで、いくつ前のページに戻るかを指定できます。
(-1) のままだと通常どおり1つ前のページへ。
(-2) にすると2つ前のページへ戻ることができます。
下記URLのリンク先にてサンプルを用意しましたので、試しに「前のページに戻る」を押して挙動を確認してみてください。
様々な場面で使い所が多いテクニックだと思います。
ぜひご利用ください。