Javascript Onmousedown不'；滴水不漏

在我的html中，我有

<div id="map"></div>

#map {
    width: 100%;
    height: 100%;
    background-color: #CCC;
}

事件永远不会被触发。如果我不将瓷砖添加到地图中，它会起作用

我试着用jquery的“on”、“onmousedown”和javascripts的“addEventListener”来实现它。 脚本没有任何编译错误。这件事似乎并没有慢慢发生

---

是因为瓷砖的位置是绝对的吗？是因为它们是动态添加的吗？

我知道绑定事件时，DIV还没有出现。尝试改用

委托

，如下所示：

$("#map").delegate("div", "mousedown", function() {
    console.log("mousedown");
});

编辑：详述 jQuery

.on（）

引用声明：“将一个或多个事件的事件处理程序函数附加到所选元素。”

此外，当您将事件直接绑定到

#map

时，只要您不使用其他内容覆盖它，它就会工作（您必须在实际的#map元素上向下移动鼠标）

jQuery

.delegate（）

引用声明：“根据一组特定的根元素，现在或将来为与选择器匹配的所有元素的一个或多个事件附加一个处理程序。”

---

由于您将在绑定事件之后添加内部div，因此这完全符合您的要求。指定“div”选择器实际上会将mousedown绑定到#map中的任何（当前或未来）div。如果您还有其他不可点击的div，您实际上可以使用

div.basictles1

。

使用JSFIDLE会更容易说明问题，问题是在您的情况下，添加平铺之前一切都很好，因为添加平铺之后，map div位于平铺后面，而mousedown将无法通过上元素降低。@AivarLuist，的确但如何解决这个问题呢？它们在dom中被链接为child，因此我认为事件会慢慢流到parents。如果tile本身不需要单击选项，那么您可以尝试使用CSS属性指针事件。示例用法@AivarLuist，酷。现在无法使用，但在不久的将来会变得很方便。谢谢：汉克斯，这很有效，但我不明白为什么。你能详细说明一下吗？它是否将事件绑定到地图下的所有div？因为会有成千上万的瓷砖。我不知道这是否是个好主意，那么，在您的情况下使用

.delegate（）

确实是个好主意。看看

$('#map').on('mousedown', function(){console.log("mousedown");});

$("#map").delegate("div", "mousedown", function() {
    console.log("mousedown");
});