• 复制粘贴插件(不包含 Flash)——clipboard.js


     clipboard.js是现代化的“复制到剪切板”插件。不包含 Flash。gzip 压缩后仅 3kb。不依赖 Flash 或其他臃肿的框架。API:https://clipboardjs.com
     clipboard.js引用:

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

     你需要通过传入一个DOM 选择器HTML 元素, 或者 HTML 元素数组作为参数,来实例化对象。

    new ClipboardJS('.btn');//复制按钮的class或者id或者...

     data-clipboard-action这个属性有两个值:data-clipboard-action="cut"(剪切)和data-clipboard-action="copy"(复制),默认是复制
     使用demo:

    js部分:
    var clipboard = new ClipboardJS('.btn');
    clipboard.on('success', function(e) {
      console.info('Action:', e.action);//
      console.info('Text:', e.text);//复制得到的内容
      console.info('Trigger:', e.trigger);//复制按钮
      alert('复制成功!');
      e.clearSelection();
    });
    clipboard.on('error', function(e) {
      console.error('Action:', e.action);
      console.error('Trigger:', e.trigger);
      alert('复制失败!');
    }); 
    复制
    html部分:
    <!-- Target --> 
    <input id="foo" value="https://github.com/zenorocha/clipboard.js.git" readonly /> //用disabled的话,就不能复制了,因为disabled禁止选中
    <!-- Trigger --> 
    <button class="btn" data-clipboard-target="#foo">复制</button>
    剪切
    html部分:
    <!-- Target --> 
    <input id="foo1" value="https://github.com/zenorocha/clipboard.js.git" readonly /> //用disabled的话,就不能剪切了,因为disabled禁止选中
    <!-- Trigger --> 
    <button class="btn" data-clipboard-action="cut" data-clipboard-target="#foo1">剪切</button>

     

  • 相关阅读:
    POJ 2593&&2479:Max Sequence
    POJ 2115:C Looooops
    杭电2187--悼念512汶川大地震遇难同胞——老人是真饿了
    南阳448--寻找最大数
    杭电2544--最短路(Floyd)邻接表使用方法模板
    杭电2141--Can you find it?
    杭电1242--Rescue(BFS+优先队列)
    杭电1241--Oil Deposits(Dfs)
    南阳42--一笔画问题
    杭电1950--Bridging signals (二分法→ →LIS)
  • 原文地址:https://www.cnblogs.com/xi-li/p/10375753.html
Copyright © 2020-2023  润新知