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 插件库


  • 相关阅读:
    分治
    #include<algorithm>
    c++标准模板库的使用
    mysql_day03
    mysql_day02
    mysql_day01
    mongodb的安装
    迭代器和生成器简单介绍
    File文件操作
    数据类型
  • 原文地址:https://www.cnblogs.com/catherLee/p/12936839.html
Copyright © 2011-2022 走看看