Maison > interface Web > js tutoriel > Résumé des méthodes de copie dans le presse-papiers à l'aide de JavaScript

Résumé des méthodes de copie dans le presse-papiers à l'aide de JavaScript

黄舟
Libérer: 2017-12-04 13:34:59
original
3629 Les gens l'ont consulté

Dans notre travail de développement quotidien, nous utilisons souvent la fonction coller et copier. Plusieurs fois, nos projets vous permettront également de copier dans le presse-papiers. Ci-dessous, nous vous présenterons JavaScriptRésumé des méthodes pour. copier dans le presse-papier !

1. Cliquez sur le bouton et copiez le contenu dans la zone de texte

<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="点击复制代码" />
Copier après la connexion

2. Copiez l'adresse du sujet et l'adresse URL et transmettez-les à QQ/ Amis sur 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=&#39;copyToClipBoard()&#39; 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>
Copier après la connexion

3. Copiez directement l'url

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

4. copier à l'intérieur de la zone de texte Le contenu du contenu

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

7. Compatibilité du navigateur copyToClipboard("copier le contenu")

<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>
Copier après la connexion

8. Compatible avec tous les principaux navigateurs Code copié (combiné avec ZeroClipboard.js)

<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>
Copier après la connexion

Résumé :

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请在浏览器地址栏输入&#39;about:config&#39;并回车\n然后将 &#39;signed.applets.codebase_principal_support&#39;设置为&#39;true&#39;");
    }
    var clip = Components.classes[&#39;@mozilla.org/widget/clipboard;1&#39;].createInstance(Components.interfaces.nsIClipboard);
    if (!clip)
     return;
    var trans = Components.classes[&#39;@mozilla.org/widget/transferable;1&#39;].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("复制成功!");
   }
  }
Copier après la connexion

Cet article détaille l'implémentation JavaScript Résumé des méthodes de copie dans le presse-papiers. Chaque méthode a ses propres différences. Les amis peuvent choisir la méthode qui leur convient en fonction de leurs propres besoins.

<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(&#39;mouseOver&#39;, function (client) {
 // update the text on mouse over
 clip.setText( $(&#39;fe_text&#39;).value );
   });
   
   clip.addEventListener(&#39;complete&#39;, function (client, text) {
 //debugstr("Copied text to clipboard: " + text );
 alert("该地址已经复制,你可以使用Ctrl+V 粘贴。");
   });
   clip.glue(&#39;clip_button&#39;, &#39;clip_container&#39; );
 }
</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
Copier après la connexion

Recommandations associées :

javascript - Développement mobile html5, comment copier dans le presse-papiers ?

Un morceau de code javascript "Copier dans le presse-papiers" pour plusieurs navigateurs

JS Copier dans le presse-papiers un exemple de code

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal