• js实现复制粘贴


    项目中经常会遇到点击按钮复制订单号、订单id等内容到粘贴板中的需求。可是通常我们都是用Ctrl + c或右击复制的,别操心,js也是有复制命令的,那就是document.execCommand('copy'); 这个命令会将选中的内容复制到粘贴板中,那岂不是还需要选中?别急input和textarea元素有一个select()方法,这个方法可以帮我们自动选中。于是就有了下面的代码,复制过去试试吧!

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    function copy(text) {
        var input = document.createElement('input');
        input.setAttribute('readonly''readonly'); // 防止手机上弹出软键盘
        input.setAttribute('value', text);
        document.body.appendChild(input);
        // input.setSelectionRange(0, 9999);
        input.select();
        var res = document.execCommand('copy');
        document.body.removeChild(input);
        return res;
    }

      思路分析:

    1. 创建input或textarea,因为这两个DOM具有select方法,可以选中内容(document.execCommand('copy')复制内容必要条件);
    2. 给input赋值为需要赋值的内容
    3. 将DOM添加到文档中
    4. 选中输入框中的值(也就是要复制的值)
    5. 执行复制命令
    6. 最后别忘了从文档中移除DOM元素
    7. 此函数最后返回了复制是否成功的结果(true/false,document.execCommand('copy')本身会返回true/false),你可以做相应的交互提示等。
  • 相关阅读:
    Docker
    Alfred Workflow
    AWS Lambda
    XPath
    WebMagic
    Splash
    Selenium
    代理服务器
    JSONPath
    Sqlserver 查询分组 记录
  • 原文地址:https://www.cnblogs.com/wuxu-dl/p/12575499.html
Copyright © 2020-2023  润新知