Javascript 移动浏览器上的自定义文本选择菜单

我想在我的网页上自定义文本选择菜单，在桌面浏览器中，它的工作原理如下屏幕截图：

但自定义菜单在手机上不可见，它总是显示系统菜单，如以下屏幕截图：

---

您必须处理

touchstart

和

touchend

事件，顺便说一句，您不能

preventDefault（）

触摸屏设备上的上下文菜单，这样您就可以显示带有偏移量的工具提示来同时显示这两个事件，不要忘记添加

触摸

事件处理程序，而不是在工具提示按钮上单击：

if（！window.x）{
x={}；
}
x、 选择器={}；
x、 Selector.getSelected=函数（）{
var t=''；
if（window.getSelection）{
t=window.getSelection（）；
}else if（document.getSelection）{
t=document.getSelection（）；
}else if（文档选择）{
t=document.selection.createRange（）.text；
}
返回t；
}
var pageX；
var pageY；
$（文档）.ready（函数（）{
函数mouseHandler（）{
var selectedText=x.Selector.getSelected（）；
如果（已选择文本！=''）{
$（'ul.tools'）.css({
“左”：第x+5页，
“顶部”：第55页
}).fadeIn（200）；
}否则{
美元（'ul.tools'）。淡出（200）；
}
}
$（document.bind（“mouseup”）；
$（文档）.on（“mousedown”，函数（e）{
pageX=e.pageX；
pageY=e.pageY；
});
让lis=[…document.queryselectoral（'li'）]；
map（li=>li.addEventListener（'touchstart'，e=>console.log（e.target.innerHTML），false））；
document.addEventListener（'touchend'，e=>{
清除超时（按定时器）；
}，{被动：假}）；
document.addEventListener（'touchstart'，e=>{
按Timer=window.setTimeout（（）=>{
pageX=e.changedTouches[0]。pageX；
pageY=e.changedTouches[0]。pageY+80；//80px偏移量
鼠标手柄（）；
}, 800);
}，{被动：真}）；
});
正文{
填充：60px 10px；
}
工具{
显示：无；
列表样式：无；
盒影：0px 0px 4px rgba（0,0,0,5）；
边框：实心1px#000；
位置：绝对位置；
背景：#fff；
}
李先生{
显示：内联块；
宽度：10px；
高度：20px；
边框：实心1px#000；
保证金：5px；
填充物：5px10px；
光标：指针；
}

虎口前庭。福吉亚·多洛先生。Mauris eleifend neque ac iaculis aliquet。《三部曲》中的努克·马莱苏达·尼西（Nunc malesuada nisi）。前庭毛里斯厄洛斯，各种各样的浮雕，佩伦茨克和努克。乌尔里氏箭毒。佩伦茨克和奥古斯·莫利斯、拉齐尼亚·杜伊诺、鲁特罗姆·胡斯托。努克和奥迪奥·达皮布斯，温文尔雅的利奥·埃吉特，阿利奎特·乌纳。花叶木通，花叶木通，发酵丛直径。整层楼都是临时性的。马蒂斯·维韦拉·拉库斯·比本杜姆·弗林利亚。这是一个很好的例子。在布兰迪特的iaculis viverra neque。直径为弧形的粗粒石粉。Morbi ac nisl在convallis中进行了扫描电镜检查


一,
二,
三,
您可以发布您的点击事件处理程序代码或与菜单显示相关的代码吗？@SimonDehaut