当用户将鼠标悬停在标记上时,我会打开一个弹出窗口。当前,弹出窗口在用户将鼠标悬停在其上时关闭(例如,用户无法在弹出窗口内选择文本,因为它关闭)。我试图解决这个问题,我发现了一个很好的方法,你可以在这里看到:
http://jsfiddle.net/sowelie/3JbNY/
虽然该解决方案有效,但它在该小提琴中使用的Leaflet版本非常陈旧,因此我将Leaflet的版本更新为1.1.0版本,并且90%的时间都解决了该解决方案。
这是两个小提琴,第一个与旧Leaflet的工作解决方案相同,但我添加了一个console.log
。第二个也有console.log
,但它使用Leaflet 1.1.0
旧的:http://jsfiddle.net/3JbNY/106/
新的:http://jsfiddle.net/3JbNY/105/
请注意,100%的时间,旧解决方案始终记录正确的relatedTarget
元素,这是弹出窗口(当然,当您从标记退出到弹出窗口时。如果您从标记退出到地图,它不会是弹出窗口)。
然而,在使用新版Leaflet的同一解决方案中,即使您退出弹出窗口,relatedTarget
弹出窗口的90%的时间时间。这个百分比是任意的,我没有实际计算它,我的意思是如果你尝试的时间足够长,最终新解决方案会将弹出窗口记录为relatedTarget
,但这种情况非常罕见。
我想知道这里的正确行为是什么。在我看来,它应该像旧的解决方案一样工作:给我正确的元素,我可以退出,这样我可以检查我是否退出弹出窗口,如果那个'是这样的。为什么会改变?
是否有任何解决方法可以获得正确的relatedTarget
而不依赖于Leaflet团队修补此问题?或者也许是一个不依赖relatedTarget
的全新解决方案?
我很感激帮助!
编辑:标题说mouseover
,但我的意思是mouseout
。
答案 0 :(得分:0)
找到了罪魁祸首。一些Leaflet类有一个名为pointer-events
的CSS属性设置为none
,请查看它的作用here。因此,弹出窗口上的事件被忽略了。所以我通过简单地将属性覆盖到auto
值来解决这个问题(在我的例子中它是leaflet-tooltip
类,但它们有一个类似于弹出窗口leaflet-popup-tip-container
)的类。
有关详情,请查看Leaflet的GitHub上的此问题:https://github.com/Leaflet/Leaflet/issues/5720。