• js实现复制到剪切板


    搜罗到两种兼容性还不错的方式。

    1、第一种,通过clipboard.js插件实现(推荐

    此插件封装了很多种使用方式很方便,具体demo,可以去GitHub上看,clipboard传送门

    2、第二种,纯js实现:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>CopyDemo</title>
    </head>
    <body>
        <div id=NewsToolBox></div>
        <div id="text-content">      
            <p>测试p1</p>      
            <p>测试p2</p>  
        </div>
        <button id="copy-text-btn">复制</button>
    </body>
    </html>
    <script type="text/javascript">
        // 复制全文
        document.getElementById("copy-text-btn").onclick=function(){
            var ssrsss =document.getElementById("text-content").innerText.replace(/ +/g, ""); //获取文本并去掉空格
                var flag = copyText(ssrsss); //传递文本
                alert(flag ? '复制成功' : '复制失败')
            };
    
            function copyText(text) {
                var textarea = document.createElement("textarea"); //创建input对象
                var currentFocus = document.activeElement; //当前获得焦点的元素
                var toolBoxwrap = document.getElementById('NewsToolBox'); //将文本框插入到NewsToolBox这个之后
                toolBoxwrap.appendChild(textarea); //添加元素
                textarea.value = text;
                textarea.focus();
                if (textarea.setSelectionRange) {
                    textarea.setSelectionRange(0, textarea.value.length); //获取光标起始位置到结束位置
                } else {
                    textarea.select();
                }
                try {
                    var flag = document.execCommand("copy"); //执行复制
                } catch (eo) {
                    var flag = false;
                }
                toolBoxwrap.removeChild(textarea); //删除元素
                currentFocus.focus();
                return flag;
            }
        </script>

    上面两种方式兼容性都不错,亲测可用。

  • 相关阅读:
    VMdomainXml
    C 本地文件夸网文件Cp操作
    C++ auto 与 register、static keyword 浅析
    机器学习笔记——SVM
    NYOJ 298-点的变换(经典矩阵解决点平移、缩放、翻转和旋转)
    HDU 5407 CRB and Candies(LCM +最大素因子求逆元)
    Java总结之网络
    五月份小结
    算法——字符串匹配之BM算法
    javaweb_page指令
  • 原文地址:https://www.cnblogs.com/bookobe/p/11298115.html
Copyright © 2020-2023  润新知