IE8のCTRL+クリックがわりとやっかい
はじめに
IE8には、「新しいタブで開く」という操作が存在します。
この操作ですが、実験したところ、onclickイベントが無視されるようでして、なかなかに困ったものです。
この操作の実行方法は、以下の二つあります。
- 右クリックのメニューから行う。
- CTRL+クリック によって行う。
往々にしてこのような操作は、業務アプリにおいて「禁止したい」という要望が上がります。
で、どうやったら禁止できるのか実験したところ、意外と難しかったのでメモ。
サンプルコードを載せますが、どの程度のパターンに耐えられるかは不明ですので、使う際は要検証。
(2011/07/17追記)
最近この記事を引っかけていく方が多いですので追記を。
実はこの問題はIE7からありますので、IE7をキーワードにして調べるのも有りです。
以下の記事は参考になります。
環境
- Internet Explorer8 8.0.6001.18702
CTRL+クリックの禁止(というか操作の無視)
CTRL+クリックの操作の禁止は、onmousedownのイベントの実装で行います。
ですが、新しいタブの表示を抑止するためには、イベントハンドラ内で以下のいずれかを行う必要があるようです。
- alert等をつかってメッセージボックスを表示する
- window.open等をつかって、新しいウインドウを表示する。
というわけで、色々考えた結果私が考えた実装が以下です。
画面外に新しいウインドウを開いて、すぐ閉じるようになっています。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script type="text/javascript" > <!-- function load(){ document.onmousedown = function(e) { if(newTabDisabled_ie8(window.event) == false){ var tempwindow=window.open("","_blank","width=1,height=1,top=5000,left=5000"); tempwindow.close(); return false; } }; } function newTabDisabled_ie8(event){ if(event.ctrlKey) { if(event.srcElement.tagName == "A") { event.returnValue = false; return false; } } } //--> </script> </head> <body onload="load();"> <p> 1. <a href="b.html">test</a><br> </p> </body> </html>
動かしてみるとわかるのですが、ブラウザが一瞬フォーカスを失うので、あまりエレガントではないのですけどね。
さいごに
というわけで、一応実装案を考えたのですがもっと良い方法をお持ちの方は教えてください。