zoukankan      html  css  js  c++  java
  • js点击按钮复制内容到粘贴板

    复制内容到粘贴板,就是要选择需要复制的内容并执行document.execCommand("copy")命令:

    //复制内容到粘贴板
    function copyToClipboard(elemId) {
        var target = document.getElementById(elemId);
        // 选择内容
        target.focus();
        target.setSelectionRange(0, target.value.length);
        // 复制内容
        var succeed;
        try {
            succeed = document.execCommand("copy");
        } catch (e) {
            succeed = false;
        }
        console.log("复制成功");
        return succeed;
    }

    如果应用场景复杂些,可能有多种元素(textarea、input、div等)需要复制内容,可以写一个通用方法:

    //复制内容到粘贴板
    function copyToClipboard(elemId) {
        var elem = document.getElementById(elemId);
        var targetId = "_hiddenCopyText_";
        var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA";
        var origSelectionStart, origSelectionEnd;
        if (isInput) {
            // 复制选择内容
            target = elem;
            origSelectionStart = elem.selectionStart;
            origSelectionEnd = elem.selectionEnd;
        } else {
            // 必须有一个临时的元素存储复制的内容
            target = document.getElementById(targetId);
            if (!target) {
                var target = document.createElement("textarea");
                target.style.position = "absolute";
                target.style.left = "-9999px";
                target.style.top = "0";
                target.id = targetId;
                document.body.appendChild(target);
            }
            target.textContent = elem.textContent;
        }
        // 选择内容
        var currentFocus = document.activeElement;
        target.focus();
        target.setSelectionRange(0, target.value.length);
        // 复制内容
        var succeed;
        try {
            succeed = document.execCommand("copy");
        } catch (e) {
            succeed = false;
        }
        // 恢复焦点
        if (currentFocus && typeof currentFocus.focus === "function") {
            currentFocus.focus();
        }
        if (isInput) {
            // 恢复之前的选择
            elem.setSelectionRange(origSelectionStart, origSelectionEnd);
        } else {
            // 清除临时内容
            target.textContent = "";
        }
        console.log("复制成功");
        return succeed;
    }
  • 相关阅读:
    关于区间 $mex$ 的几种做法
    Selenium+TestNG+Maven+Jenkins+SVN(转载)
    Selenium+Java的TestNG测试报告优化
    使用Log4J收集日志
    Selenium+TestNG+Maven(2)
    自动化测试用例设计实例
    自动化测试用例的编写规则
    selenium 总结篇,常见方法和页面元素的操作
    Selenium Webdriver元素定位的八种常用方式(转载)
    selenium+java利用AutoIT实现文件上传
  • 原文地址:https://www.cnblogs.com/yeqrblog/p/9964550.html
Copyright © 2011-2022 走看看