我看到很多关于如何让 html5 canvas 元素接收鼠标点击的问题，我使用 canvas 作为覆盖层，鼠标点击不会传递到下面的元素。我正在将图像加载到 Canvas 中，我认为这可能是问题所在，但我也用空 Canvas 进行了尝试，结果相同。
举个例子: 与图像: http://www.1luckypixel.com/paranormal/canvas_test.html 链接转到谷歌，但它没有注册。
据我了解，默认情况下 Canvas 对鼠标是透明的？
最佳答案
如果不需要跨浏览器功能，那么有一个简单的解决方案。在支持非 SVG 元素的浏览器(webkit、Mozilla 和其他浏览器，但尤其不是 IE)上，您可以使用名为 pointer-events 的 css 属性。来自 MDN:
“CSS 属性 pointer-events 允许作者控制特定图形元素在什么情况下(如果有的话)可以成为鼠标事件的目标。当未指定此属性时，visiblePainted 值的相同特征适用于 SVG 内容.
除了指示该元素不是鼠标事件的目标之外，值 none 指示鼠标事件“穿过”该元素并以该元素“下方”的任何内容为目标。
警告:在 CSS 中对非 SVG 元素使用指针事件是实验性的。目前定义在CSS3 UI草案规范中，有讨论推迟到CSS4。”
至少，您可以使用 Modernizr 来检测指针事件支持并执行 Simon Sarris's answer 中提到的不透明技巧在不支持它的浏览器上。
此外，如果您的应用程序特定于谷歌地图，您可以将 Canvas 作为谷歌地图叠加层插入，从而一起避免这个问题。
例子: http://www.patrick-wied.at/static/heatmapjs/demo/maps_heatmap_layer/gmaps.php
关于html - 通过 html Canvas 获得点击，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3615533/