Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/418.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 将事件侦听器添加到画布_Javascript_Jquery_Html_Javascript Events - Fatal编程技术网

Javascript 将事件侦听器添加到画布

Javascript 将事件侦听器添加到画布,javascript,jquery,html,javascript-events,Javascript,Jquery,Html,Javascript Events,这应该不是问题,但我不明白为什么我的事件侦听器没有启动。我已经把我的代码剥离到了近乎赤裸裸的部分,但仍然不能很好地发挥作用 我突然想到的唯一变量是我正在使用jQuery的jCanvas,但我怀疑这就是问题所在 代码如下: jQuery(document).ready(function(){ // Get the Canvas set to the proper size canvas = document.getElementById("background"); canvas

这应该不是问题,但我不明白为什么我的事件侦听器没有启动。我已经把我的代码剥离到了近乎赤裸裸的部分,但仍然不能很好地发挥作用

我突然想到的唯一变量是我正在使用jQuery的jCanvas,但我怀疑这就是问题所在

代码如下:

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'); 
}

谢谢你也抽出时间来看看我那愚蠢的难题,我觉得你的代码行得通。这就是我试过的

好吧,很明显,你的背景是画布。如果元素位于另一个元素下,则无法激发事件。您的画布有一个
z索引
0
,将其保持在
主体下方。使用控制台,我刚刚更改了
z-index
,效果非常好

另一方面,你可能已经看到了谷歌的画布。如果你注意到,在一开始,你不能与雪互动。它具有较低的
z索引。一段时间后,
z-index
增加,您无法与文本交互;只有雪


如您所见,这与您使用画布无关。这只是当元素相互重叠时事件的工作方式

是的,我记得今天早上洗澡的时候。此后,我将画布移到导航栏下方,以便与两者进行交互。谢谢你的努力!
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');
}