jquery - 堆叠画布事件

Question

我在另一个画布之上有一个透明背景的画布，并希望鼠标事件由它们上的元素注册。但是，上部画布阻止任何鼠标事件到达下部画布。最好的方法是什么？

     <div class="outer">
      <div class="inner" id="canvas_container_1"></div>  
      <div class="inner" id="canvas_container_2"></div>   
     </div> 

Answer 1

在两者上，你的意思是 2 内画布吗？

如果是 = 那么只需在您的“内部”类上添加一个事件侦听器：

$('.outer').on('click','.inner',function() { ... })

Answer 2

您可以做的是模拟所有元素的触发器，如下所示：http: //jsfiddle.net/AzNQb/。

var handler = function(e) {
    // the actual handler
    console.log(e.pageX, this);
};

$(".inner").on("mousedown", function(e) {
    var args = arguments;
    var value;
    $(".inner").each(function() {
        // call handler for each element; preserve `return false` functionality
        if(handler.apply(this, args) === false) {
            value = false;
            return false;
        }
    });
    return value;
});