ホームページ作成/リンクの表示・装飾 (HTML,CSS,JavaScript)

PDFへのリンクに便利。リンク移動前に確認させる方法

特定のリンクをクリックして移動する前に、移動して良いかどうか確認ダイアログを表示させてみましょう。HTMLファイルへのリンクだと勘違いして、PDFやDOCへのリンクをクリックしてしまうことを防ぐのに良いかも。

リンク先がHTMLとは限らない

通常のウェブページへのリンクだと思ってクリックしてみたら、実はPDFファイルで、Acrobat Readerが起動してしまった……というような経験はありませんか?
急いでいるときにそうなると、腹が立ってしまう人も居そうです。

そこで今回は、リンクをクリックしたときに、本当に移動して良いかどうか確認ダイアログを表示する仕組みを用意する方法をご紹介いたします。

リンク先へ移動前に確認

次のリンクをクリックしてみて下さい。

サンプルリンク

確認ダイアログが出ましたか?
次のような確認ダイアログが表示されたと思います。

IE6でのダイアログ NN7でのダイアログ

「OK」をクリックすればリンク先へ移動し、「キャンセル」をクリックすれば何も起こりません。(移動しません)

JavaScriptで実現

JavaScriptで実現していますので、JavaScriptを無効にしているとダイアログは表示されません。 しかし、JavaScriptが無効でも、リンクそのものは有効ですから、ダイアログが出ないだけで通常のリンクとしてちゃんと機能します
ですから、安心して利用できます。

今回は、このリンクの作成方法を、仕組みと一緒にご紹介致します。

それでは、次のページへ →

あわせて読みたい

あなたにオススメ