js+html5实现复制文字按钮

<div>
<input type="text" name="guanfangaddress" id="guanfangaddress"/>
<span id="copyBT" >复制</span>
</div> <script type="text/javascript">
function copyArticle(event) {
const range = document.createRange();
range.selectNode(document.getElementById('guanfangaddress'));
const selection = window.getSelection();
if(selection.rangeCount > 0) selection.removeAllRanges();
selection.addRange(range);
document.execCommand('copy');
alert("复制成功!");
}
document.getElementById('copyBT').addEventListener('click', copyArticle, false);
</script>

h5的复制功能的更多相关文章

  1. 移动端h5实现复制功能

    首先遇到这个需求是就各种百度,但是发现基本都是用js实现,而且兼容性还非常不好. 但是在寻觅和尝试的过程中,发现只需要css代码也可以完全实现的,对需要复制内容的标签加上下面这几行代码就可以了. -w ...

  2. h5的复制功能的使用,Clipboard.js的使用,主要是在app里面使用

    app中使用,框架用的是vue.js 1.显示要下载这个Clipboard.js插件 package-lock.json里面 "clipboard-polyfill": { &qu ...

  3. H5页面长按复制功能实现

    手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 默认情况下禁止了长按复制功能,要此功能需 ...

  4. 手机端h5复制功能

    html: <a href="javascript:;" id="copyBtn" class="f-r tac" data-clip ...

  5. H5 页面 上使用js实现一键复制功能

    2.解决苹果手机浏览器 无法使用的问题  上面的方法在 iphone 手机 safari浏览器失效的问题 其实就是使用输入框先显示然后模拟选择复制在隐藏输入框

  6. 移动端h5页面的那些坑

    最近一直在写移动端页面,由于之前写移动端写的比较少,所以此次踩过许多坑.特此总结一下: 1.<input type='button'>背景色在ios中的兼容性,颜色发白 解决办法:在全局样 ...

  7. H5开发APP考题和答案

    { "last_updated": { "$date": 1544276670569 }, "page_count": 1, "a ...

  8. 旺财速啃H5框架之Bootstrap(五)

    在上一篇<<旺财速啃H5框架之Bootstrap(四)>>做了基本的框架,<<旺财速啃H5框架之Bootstrap(二)>>篇里也大体认识了bootst ...

  9. 旺财速啃H5框架之Bootstrap(四)

    上一篇<<旺财速啃H5框架之Bootstrap(三)>>已经把导航做了,接下来搭建内容框架.... 对于不规整的网页,要做成自适应就有点玩大了.... 例如下面这种版式的页面. ...

随机推荐

  1. BZOJ4556 [Tjoi2016&Heoi2016]字符串 【后缀数组 + 主席树 + 二分 + ST表】

    题目 佳媛姐姐过生日的时候,她的小伙伴从某东上买了一个生日礼物.生日礼物放在一个神奇的箱子中.箱子外边写了 一个长为n的字符串s,和m个问题.佳媛姐姐必须正确回答这m个问题,才能打开箱子拿到礼物,升职 ...

  2. 刷题总结———长跑路径(ssoj1982)

    题目: 给定一个无向图···求特定几个点中两两间的最短路中的最小值····其中1≤N,M≤100000:T≤5:1≤K≤n:1≤边长≤100000,T为一个测试点的测试数··k为测试点数量 题解: 我 ...

  3. zoj 3790 Consecutive Blocks 离散化+二分

    There are N (1 ≤ N ≤ 105) colored blocks (numbered 1 to N from left to right) which are lined up in ...

  4. PAT 甲级 1003. Emergency (25)

    1003. Emergency (25) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue As an emerg ...

  5. POJ 1011:木棒

    传送门 http://poj.org/problem?id=1011 题目大意 已知原来有等长若干木棒,现在给你一堆断了的木棒的长度,问原来的木棒最短是多长 题目类型 DFS + 剪枝 + “贪心优化 ...

  6. tableView刷新中的问题

    在开始之前先上一张效果图 相信大家都看到了“店铺优惠”这一栏,在这里假设这一栏就是单独的一个cell,当无店铺优惠的时候不可点击在有店铺优惠的时候会弹出优惠列表,选中并返回时会刷新数据,所以弹出视图采 ...

  7. ubuntu和raspberry下调试python_spi备忘

    Ubuntu12.04 自安装python3.3中头文件Python.h路径:usr/local/python3.3/include/python3.3m Ubuntu12.04 自带的Python2 ...

  8. k8s之存储卷及pvc

    1.存储卷概述 因为pod是有生命周期的,pod一重启,里面的数据就没了,所以我们需要数据持久化存储,在k8s中,存储卷不属于容器,而是属于pod,也就是说同一个pod中的容器可以共享一个存储卷,存储 ...

  9. Nginx+keepalived双机热备(主主模式)

    IP说明: master机器(master-node):10.0.0.5/172.16.1.5   VIP1:10.0.0.3slave机器(slave-node): 10.0.0.6/172.16. ...

  10. Android Studio 常见命令

    android studio 常用命令 Description Mac Linux/Win Lookup IDE commands Cmd+Shift+A Ctrl+Shift+A Open Clas ...