【JavaScript】リンクの元のページに戻る、ブラウザの「戻る」ボタンと同じ動作。

Ads by Google

JavaScript を使って、ウェブサイト上にブラウザの「戻る」ボタンと同じリンクを設置する方法です。

実装はわずか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のリンク先にてサンプルを用意しましたので、試しに「前のページに戻る」を押して挙動を確認してみてください。

実装サンプル:リンクの元のページに戻る、ブラウザの「戻る」ボタンと同じ動作。

様々な場面で使い所が多いテクニックだと思います。
ぜひご利用ください。

こちらの記事もいかがですか?

アナタにオススメ!
同じカテゴリーの他の記事です。

Ads by Google

Leave a Replyコメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です