Javascript 实现复制(Copy)动作方法大全


Posted in Javascript onJune 20, 2014

一、实现点击按钮,复制文本框中的的内容

<script type="text/javascript">
function copyUrl2()
{
var Url2=document.getElementById("biao1");
Url2.select(); // 选择对象
document.execCommand("Copy"); // 执行浏览器复制命令
alert("已复制好,可贴粘。");
}
</script>
<textarea cols="20" rows="10" id="biao1">用户定义的代码区域</textarea>
<input type="button" onClick="copyUrl2()" value="点击复制代码" />

二、复制专题地址和 url 地址,传给 QQ/MSN 上的好友

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Js复制代码</title>
</head>
<body>
<p>
<input type="button" name="anniu1" onClick='copyToClipBoard()' value="复制专题地址和url地址,传给QQ/MSN上的好友">
<script language="javascript">
function copyToClipBoard(){
var clipBoardContent="";
clipBoardContent+=document.title;
clipBoardContent+="";
clipBoardContent+=this.location.href;
window.clipboardData.setData("Text",clipBoardContent);
alert("复制成功,请粘贴到你的QQ/MSN上推荐给你的好友");
}
</script>

三、直接复制 url

<input type="button" name="anniu2" onClick='copyUrl()' value="复制URL地址">
<script language="javascript">
function copyUrl()
{
var clipBoardContent=this.location.href;
window.clipboardData.setData("Text",clipBoardContent);
alert("复制成功!");
}
</script>

四、点击文本框时,复制文本框里面的内容

<input onclick="oCopy(this)" value="你好.要copy的内容!">
<script language="javascript">
function oCopy(obj){
obj.select();
js=obj.createTextRange();
js.execCommand("Copy")
alert("复制成功!");
}
</script>

五、复制文本框或者隐藏域中的内容

<script language="javascript">
function CopyUrl(target){
target.value=myimg.value;
target.select(); 
js=myimg.createTextRange(); 
js.execCommand("Copy");
alert("复制成功!");
}
function AddImg(target){
target.value="[IMG]"+myimg.value+"[/ img]";
target.select();
js=target.createTextRange(); 
js.execCommand("Copy");
alert("复制成功!");
}
</script>

六、复制 span 标记中的内容

<script type="text/javascript">
</script>
<br />
<br />
<script type="text/javascript">function copyText(obj) 
{
var rng = document.body.createTextRange();
rng.moveToElementText(obj);
rng.scrollIntoView();
rng.select();
rng.execCommand("Copy");
rng.collapse(false);
alert("复制成功!");
}
</script>

七、浏览器兼容  copyToClipboard("拷贝内容")

function copyToClipboard(txt) {
      if (window.clipboardData) {
        window.clipboardData.clearData();
        clipboardData.setData("Text", txt);
        alert("复制成功!");
 
      } else if (navigator.userAgent.indexOf("Opera") != -1) {
        window.location = txt;
      } else if (window.netscape) {
        try {
          netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
        } catch (e) {
          alert("被浏览器拒绝!\n请在浏览器地址栏输入'about:config'并回车\n然后将 'signed.applets.codebase_principal_support'设置为'true'");
        }
        var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
        if (!clip)
          return;
        var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
        if (!trans)
          return;
        trans.addDataFlavor("text/unicode");
        var str = new Object();
        var len = new Object();
        var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
        var copytext = txt;
        str.data = copytext;
        trans.setTransferData("text/unicode", str, copytext.length * 2);
        var clipid = Components.interfaces.nsIClipboard;
        if (!clip)
          return false;
        clip.setData(trans, null, clipid.kGlobalClipboard);
        alert("复制成功!");
      }
    }

八、兼容各大浏览器的复制代码(结合ZeroClipboard.js)

<html>
<head>
<title>Zero Clipboard Test</title>
<script type="text/javascript" src="ZeroClipboard.js"></script>
<script language="JavaScript">
 var clip = null; 
 function $(id) { return document.getElementById(id); } 
 function init() {
     clip = new ZeroClipboard.Client();
     clip.setHandCursor(true);     
     clip.addEventListener('mouseOver', function (client) {
  // update the text on mouse over
  clip.setText( $('fe_text').value );
     });
     
     clip.addEventListener('complete', function (client, text) {
  //debugstr("Copied text to clipboard: " + text );
  alert("该地址已经复制,你可以使用Ctrl+V 粘贴。");
     });
     clip.glue('clip_button', 'clip_container' );
 }
</script>
</head>
<body onLoad="init()">
<input id="fe_text" cols=50 rows=5 value=复制内容文本1 >
<span id="clip_container"><span id="clip_button"><b>复制</b></span></span>
</body>
</html>
Javascript 相关文章推荐
为JavaScript类型增加方法的实现代码(增加功能)
Dec 29 Javascript
JavaScript的模块化:封装(闭包),继承(原型) 介绍
Jul 22 Javascript
jquery 字符串切割函数substring的用法说明
Feb 11 Javascript
原生JavaScript+LESS实现瀑布流
Dec 12 Javascript
jQuery中parents()方法用法实例
Jan 07 Javascript
jQuery插件bgStretcher.js实现全屏背景特效
Jun 05 Javascript
JavaScript判断图片是否已经加载完毕的方法汇总
Feb 05 Javascript
JS中使用apply、bind实现为函数或者类传入动态个数的参数
Apr 26 Javascript
IE8利用自带的setCapture和releaseCapture解决iframe的拖拽事件方法
Oct 25 Javascript
ES6中module模块化开发实例浅析
Apr 06 Javascript
react 父组件与子组件之间的值传递的方法
Sep 14 Javascript
30分钟用Node.js构建一个API服务器的步骤详解
May 24 Javascript
Blocksit插件实现瀑布流数据无限( 异步)加载
Jun 20 #Javascript
教你如何自定义百度分享插件以及bshare分享插件的分享按钮
Jun 20 #Javascript
jQuery.lazyload+masonry改良图片瀑布流代码
Jun 20 #Javascript
Node.js实现简单聊天服务器
Jun 20 #Javascript
SuperSlide2实现图片滚动特效
Jun 20 #Javascript
javascript实现十六进制颜色值(HEX)和RGB格式相互转换
Jun 20 #Javascript
js常用数组操作方法简明总结
Jun 20 #Javascript
You might like
PHP教程 变量定义
2009/10/23 PHP
php中设置多级目录session的问题
2011/08/08 PHP
设置php页面编码的两种方法示例介绍
2014/03/03 PHP
PHP定时任务延缓执行的实现
2014/10/08 PHP
PHP编写daemon process 实例详解
2016/11/13 PHP
php设计模式之单例模式用法经典示例分析
2019/09/20 PHP
laravel框架数据库操作、查询构建器、Eloquent ORM操作实例分析
2019/12/20 PHP
为开发者准备的10款最好的jQuery日历插件
2014/02/04 Javascript
$.each与$().each的区别示例介绍
2014/03/20 Javascript
jQuery实现鼠标滚轮动态改变样式或效果
2015/01/05 Javascript
AngularJS入门教程之链接与图片模板详解
2016/08/19 Javascript
在js里怎么实现Xcode里的callFuncN方法(详解)
2016/11/05 Javascript
微信小程序保存多张图片的实现方法
2019/03/05 Javascript
jquery获取input输入框中的值
2019/11/13 jQuery
Angular之jwt令牌身份验证的实现
2020/02/14 Javascript
JavaScript数组类型Array相关的属性与方法详解
2020/09/08 Javascript
Ant Design moment对象和字符串之间的相互转化教程
2020/10/27 Javascript
python使用webbrowser浏览指定url的方法
2015/04/04 Python
Python selenium 三种等待方式详解(必会)
2016/09/15 Python
python GUI库图形界面开发之PyQt5拖放控件实例详解
2020/02/25 Python
pip安装tensorflow的坑的解决
2020/04/19 Python
python sitk.show()与imageJ结合使用常见的问题
2020/04/20 Python
实例讲解使用SVG制作loading加载动画的方法
2016/04/05 HTML / CSS
Lookfantastic西班牙官网:英国知名美妆购物网站
2018/06/13 全球购物
delegate与普通函数的区别
2014/01/22 面试题
2014党委书记四风问题对照检查材料思想汇报
2014/09/22 职场文书
2014年污水处理厂工作总结
2014/12/19 职场文书
2015夏季作息时间调整通知
2015/04/24 职场文书
2015年团队工作总结范文
2015/05/04 职场文书
舞蹈社团活动总结
2015/05/07 职场文书
2016年大学迎新工作总结
2015/10/14 职场文书
几款流行的HTML5 UI框架比较(小结)
2021/04/08 HTML / CSS
go语言求任意类型切片的长度操作
2021/04/26 Golang
Python破解极验滑动验证码详细步骤
2021/05/21 Python
python 常用的异步框架汇总整理
2021/06/18 Python
PHP面试题 wakeup魔法 Ezpop pop序列化与反序列化
2022/04/11 PHP