javascript – 如何检测画布何时可以进行操作？

我通过jQuery动态地将X canvas元素添加到页面中,如下所示：

$(document).ready(function() { 
    for(i=0;i<4;i++) {
        var can = $(document.createElement("canvas"))
                   .attr("id","table"+i)
                   .addClass("table")
                   .attr("width",640)
                   .attr("height",480)
                   .appendTo('#container');   
    }

    //...
});

.append()和.appendTo()都没有回调,因为它们应该立即发生.不幸的是,关于canvas元素的东西不会立即发生.

当我在其中一个canvas元素上转到.getContext(‘2d’)时,它将失败并显示“getContext不是函数”.这种情况发生在FF 3.5以及Chrome上.

如果我为画布元素分配和任意事件处理程序,如.click(),并在该事件中使用.getContext(),它可以完美地工作.

如何有效地确定画布已准备好进行操作？

解决方法:

我认为你不能在can变量上使用getContext().

如果你这样做,请尝试[0] .getContext().这实际上会得到元素对象,而不是jQuery.