zoukankan      html  css  js  c++  java
  • react 实现复制copy文本内容

    思路:
    • 选中想要复制的元素对象
    • 创建range对象,把选中的元素对象放进去
    • 讲range对象添加到selection对象,执行copy命令
    代码:
    //按钮绑定事件
    <Button onClick={copyOrderNumber} className='order-num-operate'>
      Copy
     </Button>
    const copyOrderNumber = () => {
    //选中节点
        const copyEle = document.querySelector('.order-number-text')
    //创建Range对象(某个区域内连续的内容)
        const range = document.createRange()
    //清除页面中已有的selection
        window.getSelection().removeAllRanges()
    //选中需要复制的节点
        range.selectNode(copyEle)
    //执行选中元素
        window.getSelection().addRange(range)
    //执行 copy 操作
        const copyStatus = document.execCommand('Copy')
        // 对成功与否定进行提示
        if (copyStatus) {
          Toast.success('Copy Success', 1)
        } else {
          Toast.fail('Copy Failed', 1)
        }
    // 移除选中的元素
        window.getSelection().removeAllRanges()
      }
  • 相关阅读:
    TinyOS在ubuntu 14.04下安装教程
    C++ STL标准入门
    C++ 模板
    多态
    C++继承
    C++类型转换 -- 由其他类型转换到自定义类型
    运算符重载
    友元
    typedef用法
    c++细节--section1
  • 原文地址:https://www.cnblogs.com/hl-tyc/p/14246565.html
Copyright © 2011-2022 走看看