2011-05-10 82 views
4

在拉斐爾,js,我該如何選擇一個元素?例如,如果我有一個矩形,如何選擇它?在Raphael中,是否有任何方法來選擇元素,如使用jQuery選擇DOM元素?Raphael.js,如何選擇一個元素?

回答

6

要選擇一個svg DOM元素,假設raphael元素的一個節點有一個ID,您可以在'jQuery'模式下使用$('#ID')或'native'方式document.getElementById('ID')

此外,使用拉斐爾事件的處理是非常簡單的,例如,當你點擊一個矩形,你可以「選擇」它,這樣(演示這裏=>http://jsfiddle.net/steweb/zMYU8/):

標記

<div id="canvas"></div> 

JS

var selected = null; //var to store selected element 

//initialize the raphael canvas and store it in a var 
var canvas = Raphael(document.getElementById("canvas"), 320, 200); 

//first rectangle 
var r = canvas.rect(10, 10, 50, 50).attr("fill", "#FFFF22"); 

//second rectangle 
var r1 = canvas.rect(70, 70, 50, 50).attr("fill", "#FFFF22"); 

//first rectangle click 
r.click(function(){ 
    //change attributes 
    r1.attr("stroke","black"); 
    r.attr("stroke","green"); 
    selected = r; //update selected var 
}); 

//second rectangle click 
r1.click(function(){ 
    //change attributes 
    r.attr("stroke","black"); 
    r1.attr("stroke","green"); 
    selected = r1; //update selected var 
});