zoukankan      html  css  js  c++  java
  • JS实现文字的点击复制

    在项目中遇到了这个需求 经过查询资料解决了这个问题

    首先需要引用一个JS插件包

    https://files.cnblogs.com/files/RVon/clipboard.min.js

    插件的使用很简单,点击复制代码实现如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>function-text</title>
    </head>
    <body>
        <div class="content">
        	
        </div>
    
        <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
        <script src="clipboardMin.js"></script>
    
        <script>
    	for(var i = 0;i<5;i++){
    		var p = `<p class='c'>${i}要被复制的内容</p>`;
    		$('.content').append(p)
    	}
    
        var s;
        $(".c").click(function(){
        	s = $(this).text();
        })
        console.log(s)
        var clipboard = new Clipboard('.c', {
            text: function() {
            	 console.log(s)
                return s;
            }
        });
    
        clipboard.on('success', function(e) {
            alert("复制成功");
        });
    
        clipboard.on('error', function(e) {
            console.log(e);
        });
        </script>
    </body>
    </html>
    

      

  • 相关阅读:
    第二阶段团队站立会议06
    第二阶段团队站立会议05
    Spring
    JVM
    线程池
    java内存模型
    线程
    接口与抽象类
    动态绑定,多态,static
    同步异步,并发并行概念的理解
  • 原文地址:https://www.cnblogs.com/RVon/p/7344500.html
Copyright © 2011-2022 走看看