Question

在我的HTML中我有

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

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

动态填充了几个div，如下所示

<div class="basicTiles1" style="left: 8128px; top: 8128px;"></div>

.basictiles1 {
    position: absolute;
    width: 64px;
    height: 64px;
    background-image: url(<snip urlToPng>);
    background-position: 0px 0px;
}

然后将一个onmousedown事件添加到#map，如此

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

永远不会触发事件。如果我没有将贴图添加到地图中，它就会起作用。

我尝试使用jquery的'on'，'onmousedown'，javascripts'addEventListener'。该脚本没有任何编译错误。事件似乎并没有逐渐消失。

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

Answer 1

我知道当你绑定事件时，DIV还没有。请尝试使用delegate，如下所示：

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

编辑：精心制作 jQuery .on()引用声明：“将一个或多个事件的事件处理函数附加到所选元素。”

此外，当您将事件直接绑定到#map时，只要您不用其他内容覆盖它（您必须在实际的#map元素上进行moused），它才会起作用。

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

由于您将添加内部div-after-binding事件，这完全适合您想要做的事情。指定“div”选择器实际上将mousedown绑定到#map中的任何（当前或将来）div。如果你有其他不可点击的div，你实际上可以使用div.basictiles1。

Onmousedown没有涓滴

1 个答案: