無料Wikiサービス | デモページ
Linuxなどのメモ書き

JavaScript 右クリックの抑止


右クリックされた時にコンテキストメニューが出るのを抑止する方法。

対象:IE6、FireFox

1. 抑止方法

右クリックされた時のイベントはoncontextmenuで取得できる。このイベントハンドラでfalseを返してイベントをキャンセルしてやればよい。

以下はdocument全体で右クリックを抑止する例。documentを特定のElementにすれば、そのElementの上だけで抑止される。

document.oncontextmenu = function () {return false;}

2. iframe内での右クリックの抑止

iframe内での右クリックを抑止する場合、IEとFireFoxで処理を分けないといけなかった。

2.1 IE6でのやりかた

基本的に上記のやりかたと同じ。iframeのドキュメントを取得して、そのドキュメントのoncontextmenuにfalseを返すハンドラを設定すればよい。

 var doc = frames['frameID'].document;  ('frameID'はiframeのID)
doc.oncontextmenu = function () {return false;}

2.2 FireFoxでのやりかた

IE6と異なるのは以下の2点。
  1. イベントハンドラの設定にaddEventListener()を使用する。
  2. ハンドラ内でfalseを返す代わりにpreventDefault()メソッドを呼ぶ。
var doc = document.getElementById('frameID').contentDocument;
doc.addEventListener('contextmenu',
function (event) {
event.preventDefault();},
false);

[メモ]
1. については、iframe内のdocumentにイベントハンドラを設定するにはaddEventListener()で登録しないとできないみたい。doc.oncontextmenuのようにプロパティに設定する方法ではイベントハンドラが呼び出されなかった。

2. については、return falseでは
右クリックした時になぜか通常通りコンテキストメニューが表示されてしまう。preventDefault()を呼び出すとイベントをキャンセルし、デフォルト動作(この場合はコンテキストメニューの表示)が発生しなくなる。通常のdocumentでもpreventDefault()がなければ、メニューが表示されてもよさそうだが、この挙動の違いの理由は不明。。。


最終更新 2006/06/29 21:42:46 - kztomita
(2006/06/29 21:05:26 作成)