隐藏在选定文本的突出显示后面的弹出窗口答案

【问题标题】：popup hidden behind highlight of selected text隐藏在选定文本的突出显示后面的弹出窗口
【发布时间】：2016-07-13 10:14:44
【问题描述】：

我正在移动设备中实现文本突出显示的功能。当用户长按文本时，我会向他显示一个弹出窗口，他可以在其中选择突出显示选定的文本。

我的问题是覆盖所选文本的阴影出现在我的弹出窗口上方。

你可以在下图中看到它。

如何使弹出窗口出现在文本上方？

我已经尝试过 z-index 解决方案，但它不起作用。更准确地说，我在弹出容器上设置了一个非常高的 z-index (200000000020)，它并没有改变任何东西。

另外，我的应用程序的桌面版本没有这个问题，只有我使用 Cordova 构建的移动版本。

非常感谢您的帮助。

【问题讨论】：

您使用什么代码来生成弹出窗口？可能是因为它在 DOM 中的位置，iOS 选择也选择了弹出窗口。
这看起来更像是浏览器的默认设置。我不会说你可以做很多事情。由于用户正在与文本而不是弹出窗口进行交互。老实说，如果用户正在选择文本，那么现在不应该出现弹出窗口。如果用户单击链接以获取弹出窗口，则文本选择应该消失。
我正在使用 annotatorJS 的自定义版本。选择代码是这样的： var selection = Util.getGlobal().getSelection(); var range = document.createRange(); range.selectNodeContents(目标); selection.removeAllRanges(); selection.addRange(normedRange.toRange());
@Andrew，选择结束后出现弹出窗口（在 touchEnd）。当用户单击弹出窗口时，例如在注释上，文本选择消失

【解决方案1】：

我在这里遇到了类似的问题。还尝试在我的下拉列表中添加一个非常高的 9999999999 z 索引，但没有运气。当您选择一些文本然后打开下拉菜单时会发生这种情况，所选文本仍显示在下拉菜单上并且不允许您与下拉内容交互

【讨论】：

当您遇到类似问题时，您应该为问题投票。
这并不能真正回答问题。如果您有其他问题，可以点击提问。要在此问题有新答案时收到通知，您可以follow this question。一旦你有足够的reputation，你也可以add a bounty 来引起对这个问题的更多关注。 - From Review