zoukankan      html  css  js  c++  java
  • 原生js实现复制功能

    
    

    浏览器提供了 copy 命令 ,可以复制选中的内容:document.execCommand("copy")


    var text = document.getElementById("text").innerText;
    var input = document.getElementById("input");
    input.value = text; // 修改文本框的内容
    input.select(); // 选中文本
    document.execCommand("copy"); // 执行浏览器复制命令
    alert("复制成功");


    JS部分:

    copy(tar) {
    let $el = this.$refs[tar];
    $el.select();
    $el.setSelectionRange(0, $el.getAttribute("link").length);
    try {
    document.execCommand("copy");
    this.copyRes = "複製成功";
    setTimeout(() => {
    this.copyRes = "";
    }, 3000);
    } catch (err) {
    console.log(err);
    }
    },


    HTML部分:

    <div class="code-input">
    <input
    ref="foo"
    :link="shareLink"
    readonly
    v-model="shareLink"
    />
    <div
    class="clipboard-btn copy-btn"
    data-clipboard-target="#foo"
    @click="copy('foo')"
    >
    複製
    </div>
    </div>


    除此之外,还可以用clicbord.js 插件库


  • 相关阅读:
    ZOJ4125 Sekiro
    ZOJ4118 Stones in the Bucket
    ZOJ4115 Wandering Robot
    ZOJ4113 Calandar
    【递归】N皇后问题 和 2n皇后问题 dfs
    7-18
    7_13
    二维前缀和
    64位整数乘法
    【分治】魔法石的诱惑
  • 原文地址:https://www.cnblogs.com/catherLee/p/12936839.html
Copyright © 2011-2022 走看看