11

ユーザーがRapahel.jsで作成された要素を右クリックしたときに応答する必要があります。クリックイベントハンドラーをアタッチしてから、ユーザーがクリックしたマウスボタンを決定する必要があることを読みました。これを機能させることができません。

<!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>

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

私はjQueryでこの小さなトリックを見てきました：

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

しかし、それについてのこのコメントも読んでください：

はい、それも機能しますが、jQueryでのみ機能します。また、Raphaelがノードを再作成することがあるため、.nodeを使用しない方がよいでしょう。そのため、イベントハンドラーが失われます。

4

1 に答える 1

11

を使用mousedownしてテストできますe.which。これはFFとChromeで機能します。

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

クロスブラウザソリューションについては、httpe.button：//www.quirksmode.org/js/events_properties.html#buttonも参照してください。

于 2012-05-09T12:43:58.250 に答える