戻る・進む
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>サンプル</title>
<script type="text/javascript">
<!--
function go_back() {
	window.history.back();
}
function go_forward() {
	window.history.forward();
}
// -->
</script>
</head>
<body>
<a href="javascript:go_back();">戻る</a>
<a href="javascript:go_forward();">進む</a>
</body>
</html>
戻る(直接使用する場合)
<a href="javascript:history.back();">1つ前のページ</a>
<a href="javascript:history.go(-1);">1つ前のページ</a>
<a href="javascript:history.go(-5);">5つ前のページ</a>
進む(直接使用する場合)
<a href="javascript:history.forward();">1つ先のページ</a>
<a href="javascript:history.go(+1);">1つ先のページ</a>
<a href="javascript:history.go(+5);">5つ先のページ</a>
1つ前のページ back()  1つ先のページ forward()

これらはブラウザの履歴を参照して1つ前のページや1つ先のページに移動します。history.go(n); として n に数値を指定すると、その数値の前や先のページに移動します。

なお、現在開かれているブラウザの履歴が無い場合や JavaScript が無効の場合は機能しないため、これらを考慮する場合は以下のようにします。

ブラウザの履歴がある場合のみ実行する
<a href="../index.html" onclick="if (history.length) { history.back(); return false; }">[戻る]</a>
[戻る]

このように、履歴の個数を history.length で取得して履歴があれば history.back(); を実行します。履歴が無い場合や JavaScript が無効の場合はアンカーに指定したリンクを表示します。

[PR] ホットペッパー