更改KineticJS中的拖动目标

时间:2012-12-27 19:25:18

标签: javascript jquery html5 canvas kineticjs

是否可以在单击第一个对象时将被拖动的对象切换到另一个对象?

问题:在下面的jsfiddle中,当拖动红色圆圈时,它会变为蓝色矩形但不响应初始拖动。必须在蓝色矩形上进行第二次拖动才能拖动它。

期望:它应该从红色圆圈变为蓝色矩形,蓝色矩形应该立即顺利地跟随拖动动作。

尝试:我尝试.simulate()这些事件,但似乎没有效果。有什么想法吗?

circle.on('dragmove', function(e) { 
    circle.simulate('click');  // used click handler to change into a blue rectange
    circle.simulate('dragend'); // (FAILED) stop dragging red circle
    rectangle.simulate('dragmove');     // (FAILED) start dragging blue rectangle
});

JSFIDDLE: http://jsfiddle.net/M6ufm/

1 个答案:

答案 0 :(得分:0)

http://jsfiddle.net/M6ufm/3/

我为你更新了这个。 基本上,您正在移除圆圈,然后在其上模拟事件,然后模拟矩形上的事件。

// Show BLUE rectangle on clicking RED circle, Hide RED circle, start dragging rectangle

circle.on('dragstart mousedown', function(e) { 
   layer.add(rectangle); 
   circle.remove();
   rectangle.simulate('mousedown');
   rectangle.simulate('dragstart');     
});