キャンバスにイベントリスナーを追加する

Question

これは問題ではありませんが、イベントリスナーが起動していない理由がわかりません。私はここで裸の骨の近くにコードを取り除きましたが、それでも素晴らしい演奏はしません。

jQueryのjCanvasを使用しているのは唯一の変数ですが、それが問題なのです。私はあなたのコードがうまくいくと思う私の愚かな難問

Answer 1

を試してみました何まあ、the link you gave in the comment for the other answerに、あなたは明らかに、バックグラウンドでキャンバスを持っています。要素が別の要素の下にある場合、イベントは起動できません。あなたのキャンバスにの0があり、それをbodyの下に保ちます。コンソールを使用して、私はちょうどz-indexを変更し、それは完全に正常に動作します。

関連するノートでは、Googleのlet it snowキャンバスのものを見たことがあります。あなたが気づいたら、最初は雪と対話できません。それは低いz-indexを持っています。しばらくすると、z-indexが増加し、テキストと対話できなくなります。雪だけで。

ご覧のとおり、これはキャンバスを使用することとは関係ありません。これは、要素がお互いに配置されている場合のイベントの仕組みです。 Simple example illustrating my point.

Answer 2

を見てあまりにも時間を割いて

jQuery(document).ready(function(){ 

    // Get the Canvas set to the proper size 
canvas = document.getElementById("background"); 
    canvas.width = document.width; 
    canvas.height = document.height; 
    canvasW = canvas.width; 
    canvasH = canvas.height; 

canvas.addEventListener("mousedown", check,false); 
}); 


function check(ev) 
{ 
alert('click'); 
} 

ありがとう：

は、ここでは、コードです。これは私がhttp://jsfiddle.net/QXSsE/1/

jQuery(document).ready(function() { 

    // Get the Canvas set to the proper size 
    canvas = document.getElementById("background"); 

    var context = canvas.getContext('2d'); 
    if (context) { 
     // You are done! Now you can draw your first rectangle. 
     // You only need to provide the (x,y) coordinates, followed by the width and 
     // height dimensions. 
     context.fillRect(0, 0, 150, 100); 
    } 
    canvas.addEventListener("mousedown", check, false); 
}); 

function check(ev) { 
    alert('click'); 
}