复制到剪切板兼容(IE/FF/Chrome/..)

Dear 丶 2021-12-07 12:21 282阅读 0赞

最近做一个复制到剪切板的功能   在网上找了很多都不好用

最后发现在了  这篇文章很不错  简洁好用   贴出来  希望能帮到更多人

原文地址：[http://www.lsproc.com/wiki/snippets:copytoclipboard][http_www.lsproc.com_wiki_snippets_copytoclipboard]

此代码修改自 discuz!, 简易实现

<script>
    var clipboardswfdata;
              
    var setcopy_gettext = function(){
        clipboardswfdata = document.getElementById('data').value;
        window.document.clipboardswf.SetVariable('str', clipboardswfdata);
    }
              
    var floatwin = function(){
        alert('copy success, ' + clipboardswfdata);
    }
    </script>

<style type="text/css">
    body {font-size:12px;}
    .clipinner {position:relative;}
    .clipboardswf {position:absolute; left:0; top:0;}
    </style>
            
    <input type="text" name="data" value="xxxxx11111" id ="data" />
    <div id="clipboard_content">
    <span class="clipinner" id="clipinner">点此复制到剪贴板
    <embed name="clipboardswf" class="clipboardswf" id="clipboardswf" οnmοuseοver="setcopy_gettext()" devicefont="false" src="./clipboard.swf" menu="false" allowscriptaccess="sameDomain" swliveconnect="true" wmode="transparent" type="application/x-shockwave-flash" height="20" width="100">
    </span>
    </div>

实现稍微有些恶心, 用 onmouseover 事件往 flash 中传递数据   
另: 没有对ie单独处理, ie中推荐使用 window.clipboardData

演示地址: [http://www.lsproc.com/demo/clipboard/demo.html][http_www.lsproc.com_demo_clipboard_demo.html]

下载:[clipbord.zip][]

另: google code 上有个 zeroclipboard 的项目, 如果想要方便的话, 也可以使用

地址: [http://code.google.com/p/zeroclipboard/][http_code.google.com_p_zeroclipboard]

[http_www.lsproc.com_wiki_snippets_copytoclipboard]: http://www.lsproc.com/wiki/snippets:copytoclipboard
[http_www.lsproc.com_demo_clipboard_demo.html]: http://www.lsproc.com/demo/clipboard/demo.html
[clipbord.zip]: http://www.lsproc.com/wiki/_media/snippets:clipboard.zip
[http_code.google.com_p_zeroclipboard]: http://code.google.com/p/zeroclipboard/

发表评论取消回复

表情：

评论列表（有 0 条评论，282人围观）

还没有评论，来说两句吧...

相关阅读

相关 php android 复制粘贴板,android实现文本复制到剪切板功能(ClipboardManager)

注意：导包的时候 API 11之前： android.text.ClipboardManager API 11之后： android.content.ClipboardMa

柔光的暖阳◎/ 2023年01月15日 06:59/ 0 赞/ 113 阅读

相关 vue：复制文字到剪切板

一、安装 npm install --save vue-clipboard2 二、在main.js文件中引入和使用复制包（全局使用） import Vue

拼搏现实的明天。/ 2023年01月10日 01:26/ 0 赞/ 168 阅读

相关 React 中实现复制到剪切板功能

React 中实现复制到剪切板功能前言最终实现方法中间踩坑前言最近有一个需求是在文章列表中实现一个【复制链接】的功能。如图： ![在

阳光穿透心脏的1/2处/ 2022年12月29日 14:29/ 0 赞/ 300 阅读

相关 js复制文本内容到剪切板

<script type="text/javascript"> function copyUrl2() { var Ur

淡淡的烟草味﹌/ 2022年11月10日 05:30/ 0 赞/ 212 阅读

相关 JS复制内容到剪切板

Html <input id="demoInput" v-model="url.pcPlayUrl" > <el-button

深藏阁楼爱情的钟/ 2022年04月06日 01:36/ 0 赞/ 287 阅读

相关 js复制内容到剪切板方法封装

// 复制的方法 function copyText(text, callback){ // text: 要复制的内容， callback: 回调

绝地灬酷狼/ 2022年04月04日 04:50/ 0 赞/ 293 阅读

相关 vue 点击按钮复制指定内容到剪切板，复制变量值到剪切板

1.安装插件 npm install --save vue-clipboard2 或者 cnpm install --save vue-clipboard

深藏阁楼爱情的钟/ 2022年01月28日 08:36/ 0 赞/ 427 阅读

相关复制到剪切板兼容(IE/FF/Chrome/..)

最近做一个复制到剪切板的功能在网上找了很多都不好用最后发现在了这篇文章很不错简洁好用贴出来希望能帮到更多人原文地址：[http://www.

Dear 丶/ 2021年12月07日 12:21/ 0 赞/ 283 阅读

相关 2.复制文本到剪切板（GUIUtility.systemCopyBuffer = "复制的文本"）

![20190101221520214.png][] ![20190101221610419.png][] if UNITY_EDITOR using Un

偏执的太偏执、/ 2021年09月17日 11:22/ 0 赞/ 495 阅读

相关 js实现复制文本内容到剪切板

原文出处：[https://blog.csdn.net/github\_36091081/article/details/77508710][https_blog.csdn.n

水深无声/ 2021年09月16日 03:06/ 0 赞/ 439 阅读