复制Input内容的js代码_支持所有浏览器,修正了Firefox3.5以上的问题


Posted in Javascript onJune 21, 2010

复制Input内容的js代码_支持所有浏览器,修正了Firefox3.5以上的问题
但IE6两行JS代码就可以,IE7以上也差不多,只不过出来一个安全提示比较恶心,用户如果看到了,一定有怀疑;
再但就是Firefox、Chrome等根本就不让你复制;
记得以前网上有这方面的代码,找了一下,发现全部不能在firefox3.5以上的版本中应该,最后终于找到了一个,代码还相当相当的复杂,不太敢用。
最后,憋的实在没有办法了,查了查资料,自已写了一个:
主要的理解的几个点:
1、Firefox这些浏览器,出于安全考虑吧,直接是不让复制的;
2、在Flash中,可以用System.setClipboard(),把内容扔到剪贴板上,然后再让FLASH工作在Firefox下;
3、在Flash播放器10.0之后呢,也是出于安全考虑吧,System.setClipboard的内容必须在FLASH里边;
4、用ExternalInterface可以和JS通信;
5、ExternalInterface在flash8中必须引用一下才可以;
默认的HTML代码:

<input type="text" id="testInput" name="testInput" value="4234324234" /> 
<div id="buttonBox"> 
<button onclick="copy('testInput')">copy</button> 
</div>

所以,设计的时候,先作第一个判断,如果是IE,就还用默认的代码,这样最没有问题,如果不是,就用一个FLASH把默认的按钮覆盖;
if (window.XMLHttpRequest){//如果不是IE时,就用FLASH的方式复制 
$('buttonBox').innerHTML = '<embed src="flashCopy.swf" width="48" 
height="23" quality="high" 
pluginspage="http://www.macromedia.com/go/getflashplayer" 
type="application/x-shockwave-flash"></embed>'; 
}

以下是所有的JS文件:
<script> 
function $(id){ 
return document.getElementById(id); 
} 
function copy(){//ie6 
var value = $('testInput').value; 
window.clipboardData.clearData(); 
window.clipboardData.setData("Text", value); 
alert('复制成功!'); 
} 
function flashCopy(){//firefox ....... 
return $('testInput').value; 
} 
function flashCopyBack(){ 
alert('复制成功!'); 
} 
if("v" != "v"){//如果不是IE时,就用FLASH的方式复制 
$('buttonBox').innerHTML = '<embed src="111.swf" width="48" height="23" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>'; 
} 
</script>

FLASH按钮的代码如下:
on (release) { 
import flash.external.ExternalInterface; 
var inputText = ExternalInterface.call('flashCopy'); 
System.setClipboard(inputText); 
ExternalInterface.call('flashCopyBack'); 
//_root.boboText.text = inputText; 
}

原理,就是避开那个安全上的限制,在点FLASH中的按钮时,通过FLASH中的代码去调页面中的JS代码,JS代码可以拿到INPUT中的值,然后再传给FLASH,这时,FLASH中就有了这些值了,然后,FLASH自已再通过System.setClipboard把这些值存到剪贴板上; 再然后,他再去调用页面中的flashCopyBack,flashCopyBack只干一件事,就是提示已复制成功!
我在Firefox、chrome、ie中都测过了,没有问题,如果谁发现有问题,请告诉我,谢谢,因为我现在已经开始用!
转载请注明出处:子鼠
Javascript 相关文章推荐
asp.net网站开发中用jquery实现滚动浏览器滚动条加载数据(类似于腾讯微博)
Mar 14 Javascript
jquery的选择器的使用技巧之如何选择input框
Sep 22 Javascript
Jquery attr(&quot;checked&quot;) 返回checked或undefined 获取选中失效
Oct 10 Javascript
jQuery DOM操作实例
Mar 05 Javascript
jQuery实用技巧必备(上)
Nov 02 Javascript
JQuery.Ajax()的data参数类型实例详解
Nov 20 Javascript
js关于getImageData跨域问题的解决方法
Oct 14 Javascript
浅谈vue的几种绑定变量的值 防止其改变的方法
Mar 01 Javascript
JsChart组件使用详解
Mar 04 Javascript
实例详解Node.js 函数
Jun 10 Javascript
js删除对象/数组中null、undefined、空对象及空数组方法示例
Nov 14 Javascript
微信小程序实现滚动Tab选项卡
Nov 16 Javascript
js操作时间(年-月-日 时-分-秒 星期几)
Jun 20 #Javascript
用JavaScript玩转游戏物理(一)运动学模拟与粒子系统
Jun 19 #Javascript
一段批量给页面上的控件赋值js
Jun 19 #Javascript
一个简单的js渐显(fadeIn)渐隐(fadeOut)类
Jun 19 #Javascript
高性能WEB开发 flush让页面分块,逐步呈现 flush让页面分块,逐步呈现
Jun 19 #Javascript
WEB高性能开发之疯狂的HTML压缩
Jun 19 #Javascript
Html中JS脚本执行顺序简单举例说明
Jun 19 #Javascript
You might like
php.ini中date.timezone设置分析
2011/07/29 PHP
PHP可变变量学习小结
2015/11/29 PHP
php rmdir使用递归函数删除非空目录实例详解
2016/10/20 PHP
php之可变函数的实例详解
2017/09/13 PHP
PHP生成随机数的方法总结
2018/03/01 PHP
分享5个非常有用的Laravel Blade指令
2018/05/30 PHP
使用jQuery.Validate进行客户端验证(初级篇) 不使用微软验证控件的理由
2010/06/28 Javascript
js创建子窗口并且回传值示例代码
2013/07/02 Javascript
jQuery查询数据返回object和字符串影响原因是什么
2013/08/09 Javascript
JS实现控制表格只显示行边框或者只显示列边框的方法
2015/03/31 Javascript
js实现顶部可折叠的菜单工具栏效果实例
2015/05/09 Javascript
详解javascript高级定时器
2015/12/31 Javascript
jqueryMobile使用示例分享
2016/01/12 Javascript
JavaScript类型系统之布尔Boolean类型详解
2016/06/26 Javascript
Ubuntu系统下Angularjs开发环境安装
2016/09/01 Javascript
将form表单通过ajax实现无刷新提交的简单实例
2016/10/12 Javascript
javascript ES6 新增了let命令使用介绍
2017/07/07 Javascript
原生JS获取元素的位置与尺寸实现方法
2017/10/18 Javascript
js判断文件类型大小并给出提示的实现方法
2018/01/03 Javascript
Vuex 进阶之模块化组织详解
2018/01/12 Javascript
Nodejs Express 通过log4js写日志到Logstash(ELK)
2018/08/30 NodeJs
vue如何使用async、await实现同步请求
2019/12/09 Javascript
Python中标准模块importlib详解
2017/04/16 Python
如何使用Python 打印各种三角形
2019/06/28 Python
Python中生成一个指定长度的随机字符串实现示例
2019/11/06 Python
pyqt5实现井字棋的示例代码
2020/12/07 Python
新西兰便宜隐形眼镜购买网站:QUICKLENS New Zealand
2019/03/02 全球购物
公益活动策划方案
2014/01/09 职场文书
文体活动实施方案
2014/03/27 职场文书
预备党员群众路线教育实践活动思想汇报2014
2014/10/25 职场文书
2014预防青少年违法犯罪工作总结
2014/12/10 职场文书
南京南京观后感
2015/06/02 职场文书
优胜劣汰,强者为王——读《鲁滨逊漂流记》有感
2019/08/15 职场文书
redis 限制内存使用大小的实现
2021/05/08 Redis
拒绝盗图!教你怎么用python给图片加水印
2021/06/04 Python
Spring Data JPA的Audit功能审计数据库的变更
2021/06/26 Java/Android