一个简单好用的工具clipboard.js markdown转html

在页面内添加复制按钮至剪切板

一个简单好用的工具clipboard.js

我的使用场景

本文只截取了自己使用过程中的一个小demo,详细的使用方法请移步clipboard.js下载使用官方说明案例

引用js,下载clipboard.js,引用至文档

<script src="../dist/clipboard.min.js"></script>
//或使用CDN
<script src="https://cdn.rawgit.com/zenorocha/clipboard.js/master/dist/clipboard.min.js"></script>

我最喜欢的添加方式,html结构简要如下

<button class="btn">Copy</button>
<div>hello</div>

js代码,创建对象后设置监听对象,return后就是你选中的要监听的节点,本人使用的时候发现这个思路比较简单(其实其他方式也简单)

<script>
    var clipboard = new Clipboard('.btn', {
        target: function() {
            return document.querySelector('div');
        }
    });

    clipboard.on('success', function(e) {
        console.log(e);
    });

    clipboard.on('error', function(e) {
        console.log(e);
    });

有兴趣的朋友可以自己测试下,愿世界和平。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值