JavaScriptで「onclick」イベントを使用して戻る機能を実装する方法


  1. history.back()メソッドを使用する方法:
<button onclick="history.back()">戻る</button>

このコードでは、history.back()メソッドをonclickイベントのハンドラとして使用しています。ユーザーがボタンをクリックすると、ブラウザの履歴を1つ前のページに戻ることができます。

  1. JavaScript関数を使用する方法:
<button onclick="goBack()">戻る</button>
<script>
function goBack() {
  window.history.back();
}
</script>

このコードでは、onclickイベントでgoBack()関数を呼び出しています。goBack()関数内でwindow.history.back()を使用することで、戻る機能を実現しています。

  1. addEventListenerメソッドを使用する方法:
<button id="backButton">戻る</button>
<script>
document.getElementById("backButton").addEventListener("click", function() {
  window.history.back();
});
</script>

このコードでは、addEventListenerメソッドを使用して「click」イベントを監視し、クリックされたときに指定された関数を実行しています。

これらはいくつかの基本的な方法ですが、JavaScriptを使用して「onclick」イベントを処理する他の方法もあります。特定の要件に応じて、これらの例をカスタマイズして利用してください。また、Webサイトやアプリケーションの要件によっては、他の方法やフレームワークを使用することもあります。