2

プログラムでいくつかの Raphael オブジェクトを作成する必要があります。field1 と field2 は div 要素です。各 Raphael オブジェクト (paper1、paper2、...) には固有のキャンバスがあり、それらはすべてまったく同じ機能を持つ必要があります。Raphael オブジェクトは、後で動的に作成する必要があります。次のコード例では、どのオブジェクトが mousedown イベントを発生させるかを知る必要があります。また、マウスダウン イベントが発生した div 要素 (ここでは field1/field2) も知りたいです。どうすれば情報を入手できますか?

var myProgram = (function() {
var paper1 = Raphael("field1", 200, 400, fieldActions);
var paper2 = Raphael("field2", 200, 400, fieldActions);

var planeAttrs = {
    fill: "#fff"  
};

function fieldActions(){
    var that = this;

    that.field = that.rect(0, 0, 200, 400, 30);

    that.field.attr(planeAttrs);

    that.field.mousedown( function(e) {
    });
});
}());
4

2 に答える 2

2 
that.field.mousedown( function(e) {
 console.log(this, this.node, this.paper.canvas, this.paper.canvas.parentNode)
});

this- 直角ラファエル オブジェクト

this.node- rect svg dom 要素

this.paper.canvas- SVG dom 要素

this.paper.canvas.parentNode- クリックされた svg を含む id (field2/field1) を持つ div。

于 2012-04-11T07:12:17.600 に答える
0

どうぞ：

that.field.mousedown( function(e) {
  var target = e.target;
  var svgElem = target.parentNode;
  var div = svgElem.parentNode;
  alert(div.id);
});

http://jsfiddle.net/mihaifm/UyPn6/3/

于 2012-04-10T21:37:27.050 に答える