window.history.back()は、ブラウザの履歴リストの中の前のURLを表示するメソッド。
ブラウザの「戻る」ボタンと同じ。
構文
<script type="text/javascript">
window.history.back();
</script>
window.history.back();
</script>
サンプルA
サンプルAの動作について
- 「戻る」ボタンをクリックすると、ブラウザの履歴リストの中の前のURLを表示する。
ブラウザの「戻る」ボタンと同じ。 - 「進む」ボタンをクリックすると、ブラウザの履歴リストの中の次のURLを表示する。
ブラウザの「進む」ボタンと同じ。
サンプルAのソースコード
HTML
<div id="sample">
<button class="sampleButton" onclick="window.history.back();">戻る</button>
<button class="sampleButton" onclick="window.history.forward();">進む</button>
</div>
<button class="sampleButton" onclick="window.history.back();">戻る</button>
<button class="sampleButton" onclick="window.history.forward();">進む</button>
</div>
CSS
<style type="text/css">
.sampleButton {
font-size: 16px;
}
</style>
.sampleButton {
font-size: 16px;
}
</style>
サンプルB
サンプルBの動作について
- 「戻る」ボタンをクリックすると、ブラウザの履歴リストの中の前のURLを表示する。
ブラウザの「戻る」ボタンと同じ。 - 「進む」ボタンをクリックすると、ブラウザの履歴リストの中の次のURLを表示する。
ブラウザの「進む」ボタンと同じ。
サンプルBのソースコード
JavaScript
<script type="text/javascript">
window.onload = initialize;
function initialize() {
document.getElementById( 'sampleBack' ).onclick = sampleBack;
document.getElementById( 'sampleForward' ).onclick = sampleForward;
}
function sampleBack() {
window.history.back();
}
function sampleForward() {
window.history.forward();
}
</script>
window.onload = initialize;
function initialize() {
document.getElementById( 'sampleBack' ).onclick = sampleBack;
document.getElementById( 'sampleForward' ).onclick = sampleForward;
}
function sampleBack() {
window.history.back();
}
function sampleForward() {
window.history.forward();
}
</script>
HTML
<div id="sample">
<button id="sampleBack" class="sampleButton">戻る</button>
<button id="sampleForward" class="sampleButton">進む</button>
</div>
<button id="sampleBack" class="sampleButton">戻る</button>
<button id="sampleForward" class="sampleButton">進む</button>
</div>
CSS
<style type="text/css">
.sampleButton {
font-size: 16px;
}
</style>
.sampleButton {
font-size: 16px;
}
</style>