は、要素セレクタのため

Question

を変数を使用しているとき、私は持っている "のgetContextは関数ではありません"：

<div id="canvasContainer"> 
    <canvas id="myCanvas" height="450" width="650"></canvas> 
</div> 

と：

var myCanvas = $("#myCanvas"); 
var myCanvasContext = myCanvas.getContext("2d"); 

まだ私が取得：

​​

ページがあるときロードされる。

私が何かしてみてください：

myCanvas.click (function() { 
    console.log("You clicked the canvas"); 
}); 

完全myCanvas作品への参照を。何がありますか？

Answer 1

getContextはjQueryライブラリの一部ではなく、WebAPIの一部です。代わりにjQueryのラッパーの生のDOM Nodeオブジェクトを参照する必要があります。

var myCanvasContext = myCanvas[0].getContext("2d"); 

（[0]はそれがjQueryのラッパーがあなたから隠していることを基礎となるDOMノードを参照ある何）。あなたの "クリック" の例では、作品

---

、（あなたのケースでは）element.clickが実際にjQueryライブラリのAPIの一部であるため：あなたのコード内https://api.jquery.com/click/

Answer 2

myCanvasはjQueryオブジェクトではなく、DOM要素..です。

文句を言わない仕事myCanvas.click(...)、その後、代わりに当然の

var myCanvas = document.getElementById("myCanvas"); 
var myCanvasContext = myCanvas.getContext("2d"); 

を次のコードを使用していますが、あなたはいつも

$(myCanvas).click(...) 

Answer 3

var myCanvas = $("#myCanvas");はjQueryオブジェクトを取得行うことができます、あなたはこの

var myCanvasContext = myCanvas[0].getContext("2d"); 

myCanvas [0] DOMオブジェクトである、

はあなたのようなjQueryオブジェクトを発現することを提案するように行う必要がありますこの

var $myCanvas = $("#myCanvas")