javascript - 使用 jquery 动态添加 Canvas

标签 javascript jquery html5-canvas

我已将所有代码包含在这个 fiddle 中:http://jsfiddle.net/RymyY/

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

每次单击第二个添加按钮时,我都希望能够添加一个新 Canvas ,但我无法让它工作。类似的代码在此处的 fiddle 中有效:http://jsfiddle.net/dzejkej/xwg5f/

我不知道为什么我的不工作。我不知道怎么了。请帮忙。

最佳答案

您不应像在示例代码中那样创建具有相同 ID 的多个元素。 document.getElementById('canvas'); 始终返回 ID 为“canvas”的第一个元素,这是应该的。

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/

关于javascript - 使用 jquery 动态添加 Canvas ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8522608/

相关文章:

javascript - CKEditor:使字体大小组合框可编辑或使用新控件

javascript - Canvas - 未捕获的类型错误 : Cannot read property 'getContext' of null

javascript - 从 Kinetic JS Image 获取像素数据

javascript - 单击时克隆项目(Html5-canvas)

javascript - 更新 React 应用程序中的状态,用新的排序对象数组替换旧数组

javascript - 如何使用 jquery 和 php 将表单数据保存到 sql

javascript - AJAX:使用数组值的背景颜色更改功能不起作用?

javascript - 所选对象自动置于最前面

javascript - 用 jest 测试函数

javascript - 如何实现代码按钮来格式化文本区域中的文本?