js实现各种复制到剪贴板的方法(分享)


Posted in Javascript onOctober 27, 2016

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

<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

以上就是小编为大家带来的js实现各种复制到剪贴板的方法(分享)全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
javascript 命名空间以提高代码重用性
Nov 13 Javascript
举例详解Python中smtplib模块处理电子邮件的使用
Jun 24 Javascript
实用jquery操作表单元素的简单代码
Jul 04 Javascript
js实现String.Fomat的实例代码
Sep 02 Javascript
easyui中combotree循环获取父节点至根节点并输出路径实现方法
Nov 10 Javascript
jQuery ajax 当async为false时解决同步操作失败的问题
Nov 18 Javascript
遍历js中对象的属性和值的实例
Nov 21 Javascript
JavaScript 完成注册页面表单校验的实例
Aug 19 Javascript
Postman的下载及安装教程详解
Oct 16 Javascript
JS实现的杨辉三角【帕斯卡三角形】算法示例
Feb 26 Javascript
vue element upload实现图片本地预览
Aug 20 Javascript
全面解析js中的原型,原型对象,原型链
Jan 25 Javascript
js复制内容到剪贴板代码,js复制代码的简单实例
Oct 27 #Javascript
微信小程序 定义全局数据、函数复用、模版等详细介绍
Oct 27 #Javascript
vue插件tab选项卡使用小结
Oct 27 #Javascript
JS实现用户注册时获取短信验证码和倒计时功能
Oct 27 #Javascript
微信小程序 action-sheet底部菜单详解
Oct 27 #Javascript
JS短信验证码倒计时功能的实现(没有验证码,只有倒计时)
Oct 27 #Javascript
微信小程序  modal弹框组件详解
Oct 27 #Javascript
You might like
理解和运用PHP中的多态性[译]
2011/08/02 PHP
PHP生成唯一的促销/优惠/折扣码(附源码)
2012/12/28 PHP
基于PHP magic_quotes_gpc的使用方法详解
2013/06/24 PHP
CodeIgniter CLI模式简介
2014/06/17 PHP
php随机显示指定文件夹下图片的方法
2015/07/13 PHP
PHP实现二维数组去重功能示例
2017/01/12 PHP
农历与西历对照
2006/09/06 Javascript
IE6不能修改NAME问题的解决方法
2010/09/03 Javascript
DIV始终居中的js代码
2014/02/17 Javascript
JavaScript动态改变HTML页面元素例如添加或删除
2014/08/10 Javascript
jQuery通过点击行来删除HTML表格行的实现示例
2014/09/10 Javascript
jquery彩色投票进度条简单实例演示
2020/07/23 Javascript
早该知道的7个JavaScript技巧
2016/06/21 Javascript
jQuery实现简洁的轮播图效果实例
2016/09/07 Javascript
Angularjs自定义指令实现三级联动 选择地理位置
2017/02/13 Javascript
JavaScript 中的 this 简单规则
2017/09/19 Javascript
jQuery实现ajax回调函数带入参数的方法示例
2018/06/26 jQuery
微信小程序如何调用图片接口API并居中显示
2019/06/29 Javascript
[01:06:26]全国守擂赛第二周 Team Coach vs DeMonsTer
2020/04/28 DOTA
使用IPython下的Net-SNMP来管理类UNIX系统的教程
2015/04/15 Python
举例讲解Python设计模式编程中的访问者与观察者模式
2016/01/26 Python
Python读取文件内容为字符串的方法(多种方法详解)
2020/03/04 Python
Python使用ElementTree美化XML格式的操作
2020/03/06 Python
Python爬虫定时计划任务的几种常见方法(推荐)
2021/01/15 Python
css3实现背景颜色渐变让图片不再是唯一的实现方式
2012/12/18 HTML / CSS
美国当红的名品折扣网:Gilt Groupe
2016/08/15 全球购物
EVE LOM英国官网:全世界最好的洁面膏
2017/10/30 全球购物
NFL墨西哥官方商店:Tienda NFL
2017/11/28 全球购物
How TDD works
2012/09/30 面试题
交通事故调解协议书
2014/04/16 职场文书
2014年招商工作总结
2014/11/22 职场文书
简历中自我评价范文
2015/03/11 职场文书
政审证明范文
2015/06/19 职场文书
高中军训感想
2015/08/07 职场文书
创业计划书详解
2019/07/19 职场文书
OpenCV-Python模板匹配人眼的实例
2021/06/08 Python