是否有针对CSS-Position和可点击区域的Android浏览器错误的解决方法？

Question

如果您有一些可点击的内容，例如<a>，<input>或<area>，在此之前您有一个绝对定位的元素，其中包含更大的z-index，则存在错误的行为'点击率”。
我点击可点击元素位于前面元素后面的区域。在其他浏览器中，有一个正确的行为，即点击不会通过前面的元素。但只有在Android浏览器中，您才能点击前面元素并激活后面的元素。这是一个已知的错误，你无法避免它。它甚至在更新版本中（我在官方Android模拟器中测试2.3.3）。

在某些论坛中描述了一些解决方法，但它们都不适用于我。

• 我尝试在前后放置<iframe>或<a>
• 我尝试更改DOM，因此浏览器状态可能会刷新
• 我试图将背部元素定位 没有工作

我特别关注图像地图的区域元素。

有没有人遇到同样的问题，并设法解决它？ 我对针对图像地图进行测试的解决方案特别感兴趣。

Answer 1

我想知道这里的一些事情。首先，拥有重叠图像和使用图像映射的目的是什么？我看到你包含jQuery - 你可以使用jQuery的悬停事件来改变图像的方向并进行交换吗？如何附加到图像映射的单击事件，并检查灯箱是否打开。如果是，则return false;。

只是想大声思考。有时候另一种看法可能会有所帮助。

Answer 2

这是一个快速蒙住眼睛的回复，请告诉我是否应该进一步扩展/修复它。一般的想法是用于禁用指针交互的悬停和焦点事件的CSS类。

yourElementClass:focus, yourElementClass:hover {
    pointer-events: none;
}

Answer 3

实际上，我已经设法通过移动下面的对象让它们不可见来避免它。 但是在类似于你的情况下，实际工作的唯一解决方法是管理jquery中的所有点击（特别是后台的点击），并根据需要绑定/取消绑定点击事件。 还有一些东西可以帮助某些版本/手机（但不解决问题）

• 上面的项目有背景：rgba（0,0,0,0.1）;
• 你应该把gif或png作为上面元素的背景（以及背景颜色作为第1点）
• 使用thouchstart而不是click，因为绑定事件有时会有所帮助。

android / browser的实际版本不会受到这个bug的影响（或者至少它永远不会发生在我身上）但是知道受影响的版本可能会很好。如果有人有名单。