ios hybird 文字全选的样式问题

Question

我们的项目是一个hybird APP，项目中需要有复制功能，但是系统自带的长按弹出菜单中的全选按钮会选中页面中的所有文字和空白区域并给这些区域加上高亮背景，期望达到全选选中当前元素的效果。我们的项目也有H5版本，H5版本表现正常。

问题出现在ios 10以及11版本的机器上，尝试使用user-select没有解决

相关代码

//页面中除了message的区域禁止选中
:not(input), :not(textarea) {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

//蓝色和白色元素为需要复制功能的区域
.message {
    user-select: text;
    -webkit-user-select: text;
    -webkit-touch-callout: default;
}

期望点击全选菜单会选中当前元素中的内容，或者有没有方案可以隐藏全选菜单，注意到比如微信内的弹出菜单就不会出现这种问题，他们应该是实现了一个弹出菜单。期望大佬不吝赐教，感激不尽啊啊啊啊啊啊。

Answer 1

监听当前元素的 touch 事件, 给当前 messsage 加上个 class, 比如 is-active. 给 html 元素加类 prepare-select-message, 然后设置如下 css.

.prepare-select-message, 
.prepare-select-message *,
.prepare-select-message *:before,
.prepare-select-message *:after {
     user-select: none !important;
}

.message.is-active,
.message.is-active:before,
.message.is-active:after {
    user-select: text !important;
}