javascript - 使用 Raphael.js 单击并拖动路径时克隆路径

Question

我有一个隐藏的路径。当我单击 div 中的某个位置时，我想克隆它，并且当我单击并按住它时能够拖动它。

问题是，一旦我完成了在路径周围的拖动，释放鼠标按钮会导致创建另一个路径。

我同时使用 Raphael.js 和 JQuery，这是我使用的代码：

var c = Raphael("holder", 640, 480);
var p = c.path("M150 0 L75 200 L225 200 Z").hide().attr("fill", "#c0c0c0");
function getCenter (bbox) {
    return [Math.floor(bbox.x + bbox.width/2.0), Math.floor(bbox.y + bbox.height/2.0)];
};

$(document).ready(function (e) {
    $('#holder').click(function (e) {
        var posX = $(this).position().left, posY = $(this).position().top;
        var [x,y] = getCenter(p.getBBox());
        p.clone()
            .transform("T"+[(e.pageX-posX-x),(e.pageY-posY-y)])
            .drag(
        function (dx, dy) {     
            this.transform("t"+(e.pageX-posX-x+dx)+","+(e.pageY-posY-y+dy));
        },
        function () {},
        function () {});
    });
});

这是一个显示奇怪行为的 JSfiddle。 http://jsfiddle.net/2gggp/3/

任何想法？

Answer 1

$('#holder').click(function (e) {
   if ($(e.target).is("path")) 
     return false;
   ...
   ...
});