挪移端实现选择实现高亮全选文本领件-
比来需要给HTML5的WebAPP在页面上实现一个复制功能：会员点击长按文本会全选文字并弹出系统“复制”菜单，会员可以点击“复制”进行复制操纵，然后粘贴到AppStore搜寻对应的利用。之所以不是采纳链接情势直接跳转到AppStore对应利用是为了通过会员的自动输入关键词搜寻给推行的公司App添加权重。所以这一个“复制”功能对会员的体验至关重要。
尝试了一些做法，在安卓/iOS平台上的兼容性都不是非常不错。在微信阅读器内是很容易实现长按文本引发系统菜单，高亮全选文本内容的。但是在其他阅读器的体现就不是很一致了。包含模拟focus input，JavaScript Selection, 运用a标签尝试激活系统菜单。这些办法都存在兼容的缺点。
1）虽然运用带有href属性的a标签在uc阅读器和baidu阅读器上长按文本会涌现“自在复制”/“选中文本”菜单，选中该菜单后会涌现“全选/复制”的菜单，但是在一些安卓手机的系统阅读器和iPhone中却被视为纯链接，只弹出“复制链接”，没有“复制文本”菜单。况且即便只考虑少局部阅读器可行，这样也给会员操纵多了一步，添加了复杂度。所以该方案不成取。
2）借助selection和range的办法需要考虑到不一样阅读器的兼容性，代码如下：
function selectText(element) {
var doc = document,
text = docgetElementById(element),
range,
selection;
if (docbodycreateTextRange) {
range = documentbodycreateTextRange();
rangemoveToElementText(text);
rangeselect();
} else if (windowgetSelection) {
selection = windowgetSelection();
range = documentcreateRange();
rangeselectNodeContents(text);
selectionremoveAllRanges();
selectionaddRange(range);
/*if(selectionsetBaseAndExtent){
selectionsetBaseAndExtent(text, 0, text, 1);
}*/
}else{
alert("none");
}
}遗憾的是在苹果 Safari上仍然没法通过点击或长按高亮选择所有文本（既然也支撑window.getSelection，为什么在Safari阅读器addRange操纵后文本不克不及默许选择，晓得缘由的请留言指教）。因而，该方式存在缺点。自动选择文本区域的办法背面后附上。
3）iPhone会员可能晓得，长按某一文本选区内文字四周的空白区域，Safari会主动将该选区内的文本高亮全选（指标文本需要放在独立的p块级容器内）。依据这一特性，用CSS margin润饰一下，应用这个特色，正好可以解决上述第二种办法在ios设施的不兼容。经过测试，不管安卓和ios平台，个别手机自带的系统阅读器都是可以兼容的。至于uc阅读器、baidu阅读器等其他厂家的挪移端产品，因为有不一样的机制，只能运用这些阅读器菜单供给的“自在复制”功能。
所以，我综合了第二种和第三种方式，运用jQuery mobile中的taphold事件来模拟longtap操纵引发手机系统的复制菜单，这样根本上可以做到在所有挪移设施阅读器上都能实现长按文本区域来高亮选择所有文本内容。再提一句，taphold的兼容bug这里就不细致附解决办法了，要是你的项目请求精雕细琢，你可以自行搜寻解决方案。
下面列出我的解决方案。概括代码如下：
HTML代码：
1、必需首次下载才生效
2、不克不及从排名榜下载哦
三国艳义手机优化巨匠
★长按虚线框,拷贝关键词
去AppStore搜寻下载
JavaScript代码：
打赏
