zoukankan      html  css  js  c++  java
  • Clipboard.js实现复制

    Clipboard.js实现文本复制或者剪切到剪切板

    引用js文件

    <script type="text/javascript" src="./dist/clipboard.min.js"></script>
    

    使用一

    <!-- Target -->
    <input id="foo" value="https://github.com/zenorocha/clipboard.js.git"> 
    <!-- Trigger -->
    <button class="btn" data-clipboard-target="#foo">  Copy to clipboard</button>
    
    <script>    
        //必须要初始化 第一种初始化    
        var clipboard = new ClipboardJS('.btn');    
        clipboard.on('success', function(e) {        
            console.log(e);    
        });    
        clipboard.on('error', function(e) {        
            console.log(e);    
        });  
    </script>
    

    使用二

    <div id="btn" data-clipboard-text="1">
        <span>Copy</span>
    </div>
    
    <script>    
        var btn = document.getElementById('btn');    
        var clipboard = new ClipboardJS(btn);    
        clipboard.on('success', function(e) {        
            console.log(e);    
        });    
        clipboard.on('error', function(e) {        
            console.log(e);    
        });
    </script>
    

    使用三

    <button data-clipboard-text="1">Copy</button>
    <button data-clipboard-text="2">Copy</button>
    <button data-clipboard-text="3">Copy</button>
    
    <script>    
        var btns = document.querySelectorAll('button');    
        var clipboard = new ClipboardJS(btns);    
        clipboard.on('success', function(e) {        
            console.log(e);    
        });    
        clipboard.on('error', function(e) {        
            console.log(e);    
        });
    </script>
    
  • 相关阅读:
    MySQL--字符集参数
    MySQL--字符集基础
    Cassandra基础2
    Cassandra基础
    Cassandra -- Cassandra 3.0版本安装
    Cassandra Demo--Python操作cassandra
    MySQL--批量插入导致自增跳号问题
    MySQL Disk--SSD和HDD的性能
    MySQL Lock--并发插入导致的死锁
    TCL-视图
  • 原文地址:https://www.cnblogs.com/smss/p/9746692.html
Copyright © 2011-2022 走看看