Kinetic.js：每個rect的點擊事件

Question

如何爲每個Kinetic.Rect創建一個點擊事件？

比方說，我有這樣的：

var bar1 = new Kinetic.Rect({ 
     x: 0, 
     y: 100, 
     width: 400, 
     height: 10, 
     fill: 'grey', 
     stroke: 'black', 
     strokeWidth: 2 
}); 

var bar2 = new Kinetic.Rect({ 
     x: 0, 
     y: 100, 
     width: 400, 
     height: 10, 
     fill: 'grey', 
     stroke: 'black', 
     strokeWidth: 2 
}); 

有沒有辦法有兩個條相同的點擊事件？ 可能使用jQuery？

Answer 1

您可以創建一個var layer = new Kinetic.Layer();並添加條給它那麼層.on

layer.add(bar1); 
layer.add(bar2); 
//... 
layer.on('click',function(e) { 
      //... 
      //bar1/bar2 is e.targetNode 

看到http://konvajs.github.io/docs/events/Multi_Event.html

否則

function handleClick(e) { 
     //.. 
     //bar1/bar2 is e.target 
     } 

bar1.on("click",handleClick); 
bar2.on("click",handleClick); 
//...