解决h5一键复制的问题

首先方法一：

<div><span id="user_ref_id">复制内容</span><input style="margin-left: 30px;" type="button" onclick="cp(document.getElementById('user_ref_id'));" value="复制给好友" >
</div>

function selectText(x) {if (document.selection) {var range = document.body.createTextRange();range.moveToElementText(x);range.select();} else if (window.getSelection) {var selection = window.getSelection();var range = document.createRange();selection.removeAllRanges();range.selectNodeContents(x);selection.addRange(range);}}function cp(x){selectText(x);document.execCommand("copy");alert("复制成功,快去分享好友吧")}

方法二：

<input type="text" onclick="copy('复制内容')" value="随意" readonly="readonly">

function copy(message) {var input = document.createElement("input");input.value = message;document.body.appendChild(input);input.select();input.setSelectionRange(0, input.value.length), document.execCommand('Copy');document.body.removeChild(input);alert("复制成功");
}

方法三：

<div class="copy-font"><div class="uuid-code" id="content">saidfh3is21111h</div><button class="btn-copy" id="copyBT">复制</button>
</div>

function copyArticle(event) {const range = document.createRange();range.selectNode(document.getElementById('content'));const selection = window.getSelection();if(selection.rangeCount > 0) selection.removeAllRanges();selection.addRange(range);document.execCommand('copy');alert("复制成功！");}document.getElementById('copyBT').addEventListener('click', copyArticle, false);

这几个方法都是可以的都可以实现基本的复制功能

解决h5一键复制的问题相关推荐

H5一键复制兼容iOS
浏览器原生剪贴板 navigator.clipboard 1. 写入 navigator.clipboard.writeText navigator.clipboard.writeText('需要复制 ...
h5实现一键复制到粘贴板兼容iOS
copyText = (text) => {// 数字没有 .length 不能执行selectText 需要转化成字符串const textString = text.toString();l ...
html 一键复制 ios,h5实现一键复制到粘贴板-兼容ios
实现原理采用document.execCommand('copy')来实现复制到粘贴板功能复制必须是选中input框的文字内容,然后执行document.execCommand('copy')命令 ...
h5 实现一键复制到粘贴板兼容iOS
效果展示先贴上测试连接 http://cdn.foundao.com/zhaosheng/copytext 实现原理采用 document.execCommand('copy') 来实现复制到粘贴 ...
H5实现一键复制微信并打开微信跳转好友添加页
H5实现一键复制微信号并跳转打开微信添加好友,接下来我们使用[天天外链]创建复制搜索微信公众号H5. 天天外链 - 一键复制微信并跳转好友添加H5制作.http://nilife.cn 以上功能主要分 ...
【Vue】vue移动端h5网页写入手机剪贴板内容，vue-clipboard2插件一键复制实战
项目场景: 提示:这里简述项目相关背景: vue移动端项目,在手机端打开网页,一键复制指定内容变量参考链接1 问题描述提示:这里描述项目中遇到的问题: 复制复制,复制变量到剪贴板解决方案: 1. ...
uniapp 微信小程序 - 调起手机摄像头: 拍摄身份证的正反面，自定义身份证取景框，在相机上绘制 “身份证轮廓“ 与提示文字（超详细示例源码，一键复制运行开箱即用）
效果图这个需求很难在网上找到,就算找到都是很乱的代码.. 本篇博客实现了在uniapp项目中,微信小程序平台下调起手机相机照身份证功能,在相机上添加辅助框.自定义文案或图片(给相机加上身份证辅助线的 ...
ios下js复制到粘贴板_h5实现一键复制到粘贴板兼容ios
实现原理采用document.execCommand('copy') 来实现复制到粘贴板功能复制必须是选中input框的文字内容,然后执行document.execCommand('copy') ...
华为手机NFC功能，教你一键复制各种卡
日常生活中,我们经常会携带各种卡,比如:公交卡.门禁卡.银行卡等,但是有时候忘记带了怎么办?或者带了却丢失了. 很多人都知道NFC功能支持充值公交卡,但是它的其他作用你还知道多少个,这期小编来告诉你华 ...

解决h5一键复制的问题

解决h5一键复制的问题相关推荐

最新文章

热门文章