复制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 相关文章推荐
判断文档离浏览器顶部的距离的方法
Jan 08 Javascript
IE6-IE9中tbody的innerHTML不能赋值的解决方法
Sep 26 Javascript
jquery实现网站列表切换效果的2种方法
Aug 12 Javascript
详解Javascript几种跨域方式总结
Feb 27 Javascript
jQuery实现的动态文字变化输出效果示例【附演示与demo源码下载】
Mar 24 jQuery
vue.js todolist实现代码
Oct 29 Javascript
旺旺在线客服代码 旺旺客服代码生成器
Jan 09 Javascript
JavaScript的Object.defineProperty详解
Jul 09 Javascript
webpack4.x开发环境配置详解
Aug 04 Javascript
详解小程序原生使用ES7 async/await语法
Aug 06 Javascript
浅析TypeScript 命名空间
Mar 19 Javascript
微信小程序实现转盘抽奖
Sep 21 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
php4的session功能评述(三)
2006/10/09 PHP
请离开include_once和require_once
2013/07/18 PHP
php无限遍历目录示例
2014/02/21 PHP
php获取textarea的值并处理回车换行的方法
2014/10/20 PHP
php查找字符串出现次数的方法
2014/12/01 PHP
浅析PHP中的 inet_pton 网络函数
2019/12/16 PHP
Display SQL Server Version Information
2007/06/21 Javascript
javascript下利用arguments实现string.format函数
2010/08/24 Javascript
Jquery显示、隐藏元素以及添加删除样式
2013/08/09 Javascript
document.addEventListener使用介绍
2014/03/07 Javascript
14个有用的Jquery技巧分享
2015/01/08 Javascript
浅谈Sizzle的“编译原理”
2015/04/14 Javascript
HTML5之WebSocket入门3 -通信模型socket.io
2015/08/21 Javascript
JavaScript实现带箭头标识的多级下拉菜单效果
2015/08/27 Javascript
Javascript中函数名.length属性用法分析(对比arguments.length)
2016/09/16 Javascript
JavaWeb表单及时验证功能在输入后立即验证(含用户类型,性别,爱好...的验证)
2017/06/09 Javascript
jQuery获取随机颜色的实例代码
2018/05/21 jQuery
Vue-cli3项目配置Vue.config.js实战记录
2018/07/29 Javascript
解决Vue在Tomcat8下部署页面不加载的问题
2019/11/12 Javascript
Websocket 向指定用户发消息的方法
2020/01/09 Javascript
基于JS实现操作成功之后自动跳转页面
2020/09/25 Javascript
解决Antd Table组件表头不对齐的问题
2020/10/27 Javascript
Python实现端口复用实例代码
2014/07/03 Python
python中print()函数的“,”与java中System.out.print()函数中的“+”功能详解
2017/11/24 Python
手把手教你python实现SVM算法
2017/12/27 Python
解决tensorflow测试模型时NotFoundError错误的问题
2018/07/27 Python
pytorch 中的重要模块化接口nn.Module的使用
2020/04/02 Python
jupyter notebook清除输出方式
2020/04/10 Python
戴尔美国官方折扣店:Dell Outlet
2018/02/13 全球购物
波兰最早的运动鞋精品店之一:Street Supply
2019/08/29 全球购物
简述数据库的设计过程
2015/06/22 面试题
淘宝活动策划方案
2014/02/06 职场文书
2014年三八妇女节活动方案
2014/02/28 职场文书
大学生志愿者活动总结
2014/06/27 职场文书
全国法制宣传日活动总结2014
2014/11/01 职场文书
Win11快速关闭所有广告推荐
2022/04/19 数码科技