使用jquery动态添加画布 [英] add canvas dynamically with jquery

问题描述

我已将所有代码都包含在这个小提琴中： http://jsfiddle.net/RymyY/

I've included all of my code in this fiddle: http://jsfiddle.net/RymyY/

我的问题涉及左侧的添加形状按钮。

My issues deal with the 'Add Shape' button on the left hand side.

我想要每次单击第二个添加按钮时都能够添加新画布，但我无法使其工作。类似的代码在这里起作用： http://jsfiddle.net/dzejkej/xwg5f/

I want to be able to add a new canvas every time the second add button is clicked, but i cannot get it to work. Similar code works in this fiddle here: http://jsfiddle.net/dzejkej/xwg5f/

我不知道为什么我的工作不起作用。我不知道什么是错的。请帮助。

I dont know why mine is not working. I have no idea whats wrong. Please help.

推荐答案

您不应该使用与示例代码中相同的ID创建多个元素。
document.getElementById（'canvas'）; 总是返回id为canvas的第一个元素，应该如此。

You should not create multiple elements with the same ID as you are doing in the example code. document.getElementById('canvas'); always returns the first element with id "canvas", as it should.

var elementID = 'canvas' + $('canvas').length; // Unique ID

$('<canvas>').attr({
    id: elementID
}).css({
    width: rectWidth + 'px',
    height: rectHeight + 'px'
}).appendTo('#work_area');

var canvas = document.getElementById(elementID); // Use the created element

这是一个有效的例子; http://jsfiddle.net/5b8NH/

Here is a working example; http://jsfiddle.net/5b8NH/

这篇关于使用jquery动态添加画布的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！