Question

我有第一次开发html5应用程序的经验。我的问题是制定房间计划。在页面顶部，我有要拖动到底部地图区域的元素（它们被复制）。在地图区域，我可以移动元素，但不能复制。

我在图像元素的帮助下建立了拖拽画面。但现在我想用canvas来更新图像上的数字。我想使用画布文本功能来更新图像。

问题是当我从顶部复制canvas元素时，html插入很好，但是由于某些原因没有绘制。

请在此处观看代码http://jsfiddle.net/InsideZ/MuGnv/2/。 代码是为Google Chrome编写的。

Answer 1

编辑：

我在这里做了一些小的调整：http://jsfiddle.net/MuGnv/5/

请注意对drawImg函数所做的更改：

function drawImg(src, targetClass) {

    $(targetClass).each(function() {
        var ctx = $(this).get(0).getContext('2d');
        var img = new Image();
        img.src = src;
        img.onload = function() {
            ctx.drawImage(img, 0, 0);
        };

    });
}

无论何时处理掉落事件，都会再次绘制图像。这是缺失的组件，因为图像只被绘制一次。

将div元素与canvas拖到另一个

1 个答案: