JavaScriptにおける戻るボタン・進むボタンの作り方です。
戻るボタンの作り方
簡単な話、「onClick=”history.back();”」を記載すれば遷移元のページに戻れるので、ボタンに付与してあげます。
<input type=”button” Value=”戻る” onClick=”history.back();”>
こんな感じに「戻る」ボタンが作成され、クリックすると1つ前のページに戻れます。
history.back() の他にも、「history.go(-1);」でも遷移元のページに戻ることが可能です。
<input type=”button” Value=”戻る” onClick=”history.go(-1);”>
どちらでも動きは同じです。
2ページ前に戻りたい場合は、
<input type=”button” Value=”戻る” onClick=”history.go(-2);”>
と書けば2ページ前に戻ります。
進むボタンの作り方
進むボタンの場合、「onClick=”history.forward();”」を記載すれば、1つ先のページに遷移します。
<input type=”button” Value=”進む” onClick=”history.forward();”>
こんな感じに「進む」ボタンが作成され、クリックすると1つ先のページに進めます。
「history.go(1);」でも同じです。
<input type=”button” Value=”進む” onClick=”history.go(1);”>
2ページ先に進みたい場合は、
<input type=”button” Value=”戻る” onClick=”history.go(-2);”>
と書けば2ページ先に進みます。
鉄道記事も書いてます！
ちょっとリフレッシュして鉄道記事も読んでみませんか？
鉄道記事バックナンバーはこちら↓
