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

最新推荐文章于 2025-06-28 09:12:03 发布

原创最新推荐文章于 2025-06-28 09:12:03 发布 · 1.7w 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#function #class #google #input #menu #flash

javascript 同时被 2 个专栏收录

30 篇文章

订阅专栏

html+css

18 篇文章

订阅专栏

本文分享了一种简洁好用的复制到剪切板的功能，代码源自discuz!并进行了简化，适用于IE、Firefox、Chrome等浏览器。通过onmouseover事件将数据传给Flash来实现，同时提到了在IE中可以使用window.clipboardData。提供了演示地址和下载链接，以及zeroclipboard项目的参考信息，为开发者提供便利。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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

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

原文地址：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" onmouseover="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

下载:clipbord.zip

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

地址: http://code.google.com/p/zeroclipboard/