要素内のリンクをキャッチ

id="contents"の要素内のすべてのリンクに、本当にそこから移動したいかどうかをユーザーに確認させます。そして、ユーザーがそう望まない場合は、移動しないでください。

次のようになります。

詳細

要素内のHTMLはいつでも動的に読み込まれたり、再生成されたりする可能性があるので、すべてのリンクを見つけてハンドラを配置することはできません。イベント委譲を使用します。
コンテンツには入れ子のタグが含まれる場合があります。<a href=".."><i>...</i></a>のようなリンク内にも含まれます。

イベント委譲パターンの優れた利用例です。

実際の状況では、質問する代わりに、訪問者が離脱した場所に関する情報を保存する「ログ」リクエストをサーバーに送信できます。あるいは、コンテンツを読み込んでページ内に直接表示することもできます(許可されている場合)。

必要なのはcontents.onclickをキャッチしてconfirmを使用してユーザーに尋ねることだけです。良いアイデアは、URLにlink.hrefではなくlink.getAttribute('href')を使用することです。詳細については、ソリューションを参照してください。