zoukankan      html  css  js  c++  java
  • vue项目如何实现剪切板功能--vue-clipboard2

    一、vue项目利用vue-clipboard2实现剪切板的功能

      1、安装vue-clipboard2插件:cnpm install --save vue-clipboard2

      2、main.js添加

    import VueClipboard from 'vue-clipboard2'
    Vue.use(VueClipboard)

      3、copy组件:message绑定需要复制的文本/onCopy复制成功回调/onError复制失败回调

      v-clipboard:copy="message"

      v-clipboard:success="onCopy"

      v-clipboard:error="onError"

    二、原生js实现点击按钮,复制文本框中的的内容

    <body>
        <textarea cols="20" rows="10" id="test">用户定义的代码区域</textarea>
        <input type="button" onClick="copyUrl2()" value="点击复制代码" />
    </body>
    <script type="text/javascript">
    function copyUrl2(){
        var Url2=document.getElementById("test");
        Url2.select(); // 选择对象
        document.execCommand("Copy"); // 执行浏览器复制命令
        alert("已复制好,可贴粘。");
    }
    </script>
  • 相关阅读:
    事务和异常处理
    普通三层结构示例
    Viewstate与Static
    oracle 9i 的数据类型
    XSD数据集
    ASP.NET中的错误处理和程序优化
    PL/SQL程序设计
    ASP.NET 2.0中的异步页面
    Oracle中RowNum的用法
    .NET单元测试
  • 原文地址:https://www.cnblogs.com/goloving/p/8921419.html
Copyright © 2011-2022 走看看