22 Jun 2013

兼容 ie, firefox, chrome的复制内容到剪切板代码

此方法是从Discuz!里扒出来的。

原理：用 onmouseover 事件往 flash 中传递数据。

JS：

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

HTML：

<input type="text" name="" value="123456" 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>

CSS：

.clipinner {position:relative;}
.clipboardswf {position:absolute; left:0; top:0;}

FLASH级demo下载：

点此下载(注意：需要服务器环境支持，本地测试无效)

上一篇：(2013年9月7日更新)不用翻墙上YouTube，twitter，google+，谷歌快照等下一篇：常用css media

发表评论

评论列表(17)

2013-07-22 00:47

派佐罗

来踩踩

2013-07-22 00:48

派佐罗

@派佐罗：<img src="/style/face/3.gif" /><img src="/style/face/3.gif" /><img src="/style/face/3.gif" /><img src="/style/face/3.gif" />期待更多的博文

2013-08-28 17:16

terg

@派佐罗：官方店

2013-08-28 17:16

terg

@terg：个梵蒂冈

2013-08-28 17:17

terg

@terg：gf分隔带

2013-08-28 17:17

terg

@terg：广东省

2013-08-28 17:18

terg

@terg：gsa的歌声

2013-08-01 14:29

派佐罗

<img src="/style/face/5.gif" />网站友链没有撤销，只是最近在改写网页，网页有点问题。

2013-08-27 14:40

市场分析调研

很喜欢博主的文章，仔细看了博主的所有文章，说实话文章写的还是很不错的

2013-09-08 06:15

龚知甫宦

O(∩_∩)O哈哈~
<br />没想到是这样子的呀。

2013-09-11 20:42

海盗船博客

博客版面很简洁很漂亮，赞一个！

2014-03-20 15:52

谢亮

正找她呢

2014-03-28 10:42

zhtml

还是Flash的省事，浏览器兼容性对于前端的确很头痛

2014-03-28 10:43

zhtml

@zhtml：你这个评论的AJAX没做好。话说歌听着真爽~

2015-01-23 01:20

九秒

貌似clipboard是提供整个的跨浏览器copy的解决方案。不过项目已经换了人在开发。

2017-02-07 13:09

前端小武

发现, 2014-03-20 我也评论过... 我也写了个复制: https://github.com/xuexb/copy

2019-01-22 09:52

前端小武

发现 2017-02-07 评论过