复制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 相关文章推荐
JS原型对象通俗&quot;唱法&quot;
Dec 27 Javascript
简单的邮箱登陆的提示效果类似于yahoo邮箱
Feb 26 Javascript
非常实用的12个jquery代码片段
Nov 02 Javascript
javascript中获取class的简单实现
Jul 12 Javascript
原生JS实现匀速图片轮播动画
Oct 18 Javascript
javascript编写简易计算器
May 06 Javascript
vue-router 导航钩子的具体使用方法
Aug 31 Javascript
解析Vue 2.5的Diff算法
Nov 28 Javascript
解决Layui选择全部,换页checkbox复选框重新勾选的问题方法
Aug 14 Javascript
详解ES6 Promise对象then方法链式调用
Oct 20 Javascript
微信小程序 网络通信实现详解
Jul 23 Javascript
JS制作简易计算器的实例代码
Jul 04 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在字符断点处截断文字的实现代码
2011/04/21 PHP
解析php扩展php_curl.dll不加载的解决方法
2013/06/26 PHP
一漂亮的PHP图片验证码实例
2014/03/21 PHP
php使用递归计算文件夹大小
2014/12/24 PHP
在Linux系统下一键重新安装WordPress的脚本示例
2015/06/30 PHP
php计划任务之验证是否有多个进程调用同一个job的方法
2015/12/07 PHP
php可变长参数处理函数详解
2017/02/22 PHP
Jqyery中同等与js中windows.onload的应用
2011/05/10 Javascript
jquery+css+ul模拟列表菜单具体实现思路
2013/04/15 Javascript
javascript实现图片延迟加载方法汇总(三种方法)
2015/08/27 Javascript
Knockout自定义绑定创建方法
2015/12/26 Javascript
javascript如何定义对象数组
2016/06/07 Javascript
jQuery实现侧浮窗与中浮窗切换效果的方法
2016/09/05 Javascript
Javascript单例模式的介绍和实例
2016/10/08 Javascript
巧用Javascript的逻辑运算符
2016/12/02 Javascript
详解vue过滤器在v2.0版本用法
2017/06/01 Javascript
Js实现京东无延迟菜单效果实例(demo)
2017/06/02 Javascript
使用jQuery实现简单的tab框实例
2017/08/22 jQuery
node express使用HTML模板的方法示例
2019/08/22 Javascript
使用 UniApp 实现小程序的微信登录功能
2020/06/09 Javascript
python使用MySQLdb访问mysql数据库的方法
2015/08/03 Python
Python简单实现enum功能的方法
2016/04/25 Python
Python爬取APP下载链接的实现方法
2016/09/30 Python
python async with和async for的使用
2019/06/20 Python
Python读取csv文件实例解析
2019/12/30 Python
python中文分词库jieba使用方法详解
2020/02/11 Python
如何使用css3实现一个类在线直播的队列动画的示例代码
2020/06/17 HTML / CSS
使用postMessage让 iframe自适应高度的方法示例
2019/10/08 HTML / CSS
用C#语言写出在本地创建一个UDP接收端口的具体过程
2016/02/22 面试题
应聘会计求职信
2014/06/11 职场文书
安全伴我行演讲稿
2014/09/04 职场文书
2014年“四风”问题个人整改措施
2014/09/17 职场文书
2014年学校财务工作总结
2014/12/06 职场文书
总经理司机岗位职责
2015/04/10 职场文书
幼儿园毕业典礼家长致辞
2015/07/29 职场文书
PHP判断是否是json字符串
2021/04/01 PHP