Raphael.jsでsvg要素の右クリックを聴く

Rapahel.jsで作成した要素を右クリックすると反応する必要があります。私は、クリックイベントハンドラをアタッチして、ユーザがクリックしたマウスボタンを決定するだけでよいことを読んだ。私はこれを働かせることはできません。Raphael.jsでsvg要素の右クリックを聴く

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://raphaeljs.com/raphael.js"></script> 
<script> 
    window.onload = function() { 
     var r = Raphael('demo', 640, 480); 
     r.rect(10, 10, 400, 400).attr({fill: 'red'}).click(function(){ 
      alert('test'); 
     });; 
    }; 
</script> 
</head> 
<body> 
    <div id="demo"></div> 
</body> 
</html>

アラートボックスは、マウスの左ボタンをクリックしたときにのみ表示されます。右ボタンをクリックしたときにアラートボックスを表示する方法についてのご意見はありますか？

$(r.rect(10, 10, 400, 400).attr({fill: 'red'}).node).bind('contextmenu', function(){ 
      alert('test'); 
     });

をしかし、また、それについてこのcommentをお読みください：

私はjQueryを使って、この小さなトリックを見てきました

はい、それはあまりにも動作しますが、唯一のjQueryを使って、それがまた良いでしょう.node、を使用することはありません。なぜなら、Raphaelはノードを再作成することがあるため、イベントハンドラを失うことになります。

出典

2012-05-09 John

mousedownを使用し、e.whichをテストできます。これはFFとChromeで動作します：あなたにもe.buttonを見てみたいことがありますクロスブラウザのソリューションについては

var r = Raphael('demo', 640, 480); 
r.rect(10, 10, 400, 400).attr({fill: 'red'}).mousedown(function(e){ 
    if (e.which == 3) 
     alert("hi") 
});

：
http://www.quirksmode.org/js/events_properties.html#button

出典

2012-05-09 12:43:58 mihai

ありがとうございました。あなたがそれらを知っているとき、答えはとてもシンプルなようです:) – John

Raphael.jsでsvg要素の右クリックを聴く

答えて

関連する問題