zoukankan      html  css  js  c++  java
  • 抛弃flash的复制剪切插件

    纯JavaScript实现的解决方案:clipboard.js

    html部分:

    <p>点击下面的按钮将会触发JavaScript将元素内容拷贝到剪贴板内。</p>
    
    	<!-- 1. Define some markup -->
    	<div>
        <input id="foo" type="text" value="你好clipboard,这里(input)">
        <button class="btn" data-clipboard-action="copy" data-clipboard-target="#foo">复制</button>
    	</div>
    
    	<!-- 1. Define some markup -->
    	<div>
        <textarea id="bar">你好clipboard,这里(textarea)!</textarea>
        <button class="btn" data-clipboard-action="cut" data-clipboard-target="#bar">剪切</button>
    	</div>
    
    	<!-- 1. Define some markup -->
        <div id="div-target">你好clipboard,这里(div)!</div>
        <button class="btn" data-clipboard-action="copy" data-clipboard-target="#div-target">复制</button> 
    

      

    js部分:

     var clipboard = new Clipboard('.btn');
    
        clipboard.on('success', function(e) {
            console.log(e);
        });
    
        clipboard.on('error', function(e) {
            console.log(e);
        });   
    

      

     方法二:
    <textarea cols="20" rows="10" id="biao1">用户定义的代码区域</textarea>
    <input type="button" onClick="copyUrl2()" value="点击复制代码" />
    <script>
        function copyUrl2(){
             var Url2=document.getElementById("biao1");
             Url2.select(); // 选择对象
             document.execCommand("Copy"); // 执行浏览器复制命令
             alert("已复制好,可贴粘。");
        }
    </script>
     
     
  • 相关阅读:
    mfc cef<转>
    js人形时钟
    opencv给图片添加文字水印<转>
    strcore.cpp(156) 内存泄漏
    WebAssembly相关
    mingw 搭建Emscripten 环境
    mingw 设置python 设置git环境变量
    android平台yuv缩放相关<转>
    多媒体基础知识之PCM数据《 转》
    iOS 5 故事板进阶(2)
  • 原文地址:https://www.cnblogs.com/dcapple/p/7286210.html
Copyright © 2011-2022 走看看