javascript copy 复制
2012-07-12 01:46 LvSir 阅读(851) 评论(0) 编辑 收藏 举报在IE下,可以使用clipboardData
- <input type="button" name="anniu1" onClick='copyToClipBoard()' value="复制地址">
- <script language="javascript">
- function copyToClipBoard(){
- var clipBoardContent="";
- clipBoardContent+=document.title;
- clipBoardContent+="";
- clipBoardContent+=this.location.href;
- window.clipboardData.setData("Text",clipBoardContent);
- alert("复制成功!");
- }
但是在FireFox却不行,http://davidwalsh.name/clipboard 提供了一种万能方案,傅用的是flash技术,我的代码如下
- $(document).ready(function(){
- ZeroClipboard.setMoviePath('js/ZeroClipboard.swf');
- //create client
- var clip = new ZeroClipboard.Client();
- //event
- clip.addEventListener('mousedown',function() {
- clip.setText($('#inviteLink').val());
- });
- clip.addEventListener('complete',function(client,text) {
- alert("生成的代码已经复制到粘贴板,你可以使用Ctrl+V 贴到需要的地方去了哦!");
- });
- clip.glue('copy');
- });
copy为页面元素的id
这样就可以了,在IE6,IE9, FireFox8.0, Chrome15.0.874.106, 可以正常运行
注:Iteye就是用的这种方法^_^
【增加】:
flash技术使用的是事件机制,就是点击事件,它把点击区域与页面元素的区域重复,点击复制元素时,就触发flash的复制事件,
- var style = this.div.style;
- style.position = 'absolute';
- style.left = '' + box.left + 'px';
- style.top = '' + box.top + 'px';
- style.width = '' + box.width + 'px';
- style.height = '' + box.height + 'px';
昨天使用了js进行动态加载内容,发现复制失效了,找了半天,终于发现是这个问题,我的解决方案是,动态加载内容后,重新绑定,这样就可以了
增加:页面变化后,一般是通过Ajax改变了页面的内容,这时可以通过clip.reposition()重新绑定,也可能通过 clip.show(),这个方法也会调用clip.reposition();
相关的文章:https://code.google.com/p/zeroclipboard/wiki/Instructions
为了实现梦想,无论遇到多么大的困难,都不退缩!