1

我正在尝试使用 KineticJs 创建绘图画布，这是 jsfiddle 上的代码：http: //jsfiddle.net/thekucays/k7ZMc/2/

在我上面的代码中，我正在尝试创建一个矩形，并为我创建的每个矩形添加一个事件侦听器..（第 115 行）

var item = layer.get('.rect1');
item.on('click', function(){
    item.setFill('RED');
});

但是当我执行它时，如果我单击画布上的任何矩形，事件会在我创建的最后一个矩形上触发。我上面的代码有什么问题？

最好的问候，卢基·R·罗皮斯

4

2 回答 2

0

hy :) 嗯..是的，在我的代码上，我使用 rect_counter 的原因是我想跟踪我绘制的最后一个 rect..所以我不需要从第一个 rect 重新开始循环来绑定事件。 .

现在我已经（在 mouseup 事件上）更改为：

var rects = stage.get('.rect'+rect_counter);
rects.on('click', function(){
    this.setAttrs({
        fill: 'red'
    });
    //layer.draw();
});

现在它可以工作了..到目前为止一切都很好..感谢您的帮助:)

此致，

卢基·R·罗皮斯

于 2013-01-21T17:06:02.947 回答
0

您正在使用：

 var item = layer.get('.rect1'+rect_counter); //dont user "+rec_counter" as this is what binds it to the LAST element
 item.on('click', function(){
    item.setFill('RED');
 });

尝试更基本的解决方法：-------- 这个最适合我 -----------

 var itemsList = layer.getChildren(); //gets all shapes in this layer
 for(var i=0; i<itemsList.length; i++){
      if(itemsList.getName == 'rect1'){ //since you named your rectangles 'rect1' check name
          itemsList[i].on('click', function(){
             item.setFill('RED');
          });
      }
 };

或者干脆尝试使用：

 var item = layer.get('.rect'); //all rectangles, without number
 item.on('click', function(e){ // I think you need an 'e' here
     item.setFill('RED');
 });
 // I doubt this will work as ALL your rectangles need to have the same name if you want to .get() them all
于 2013-01-21T15:29:59.557 回答