Explication détaillée de la façon dont JavaScript implémente le code de la fonction de copie dans divers navigateurs

Regardez la prise en charge de chaque navigateur pour la fonction de copie :

1 Pour le navigateur IE, il existe trois solutions. Le code est le suivant :

function copy(txtid){ 
var txtObj = document.getElementById(txtid); 
if(window.clipboardData){ // 仅IE支持此对象，firefox、chrome不支持 
//1、通过clipboardData对象实现复制 
//window.clipboardData.clearData(); 
//window.clipboardData.setData("Text",txtObj.value); 
//2、通过document对象实现复制:先选择中文本，再执行复制命令 
//txtObj.select(); 
//document.execCommand("Copy"); // 仅IE支持，Firefox报语法错误，chrome执行结果返回false(不支持) 
//3、通过TextRange对象实现现复制：可以不用先选中内容 
txtObj.createTextRange().execCommand("Copy"); 
} 
}

2. Firefox est implémenté via la méthode interface Pour des raisons de sécurité, Firefox ferme cette interface dans les versions postérieures à 17. Elle est disponible dans les versions 17 et antérieures. Le code est le suivant :

var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interface.nsIClipboard);

3. Pour des raisons de sécurité, Chrome ne propose pas d'opérations dans le presse-papiers aux utilisateurs. On peut constater que la prise en charge de la fonction de copie n'est pas uniforme d'un navigateur à l'autre.

Bibliothèque Zero Clipboard
Bibliothèque Zero Clipboard js écrite par jhuckaby, qui utilise Flash pour copier le contenu dans le presse-papiers. Tant que le navigateur est équipé du plug-in Flash, le contenu peut être copié. ActionScript bloque les défauts de JavaScript et résout le problème de compatibilité de copie entre les navigateurs.
Le principe d'implémentation de Zero Clipboard : Zero Clipboard génère d'abord une balise d'objet Flash, laissant le Flash transparent flotter au-dessus du bouton de copie. En fait, ce qui est cliqué n'est pas le bouton mais le Flash. De cette façon, le contenu requis. est transféré vers Flash, puis transmis via la copie Flash vers le presse-papiers du système.
Comment utiliser Zero Clipboard
Remarque : étant donné qu'il est basé sur l'implémentation de Flash, Flash doit être exécuté dans un conteneur Web (tel qu'Apache, Tomcat) pour des raisons de sécurité. L'ouverture directe de Flash ne sera pas chargée. le bouton ressemblera à une animation suspendue, Internet a déclaré qu'un clic droit sur les paramètres Flash et l'ajout de ZeroClipboard.swf à un emplacement approuvé semblent fonctionner, mais cela ne fonctionne toujours pas. Cela peut également être un problème. mon navigateur local.
1> Téléchargez le package compressé de Zero Clipboard, décompressez-le et placez les deux fichiers dans le dossier : ZeroClipboard.js et ZeroClipboard.swf dans votre projet
2> Code : ;
Remarque : ZeroClipboard.js et ZeroClipboard.swf doivent être placés dans le même chemin, s'ils ne sont pas dans le même chemin, peuvent être définis à l'aide de ZeroClipboard.setMoviePath().
3> Copiez simplement le code comme suit :

var clip = new ZeroClipboard.Client(); // 新建一个clip对象 
clip.setHandCursor( true ); // 设置鼠标为手型 
clip.setText("hello,world"); // 设置要复制的文本，可以为文本框的值 
clip.glue("copy-botton"); // 为clip注册一个按钮，参数为按钮元素的id，点击按钮就可以实现复制

4> Méthodes couramment utilisées de Zero Clipboard, il est recommandé de visualiser directement le code source :

reposition() : Empêcher le Flash le bouton ne change pas lorsque la taille de la page change. Problème de désalignement
hide() : masquer le bouton Flash
show() : afficher le bouton Flash
setCSSEffects() : résoudre le problème du style de bouton de bouclier Flash non valide ( changer : survoler en .hover).
5>Zéro événements communs dans le Presse-papiers, la fonction de traitement des événements est addEventListener() :
load : événement de chargement du bouton Flash
mouseOver : événement de déplacement de la souris vers le haut
mouseOut : événement de déplacement de la souris
mouseDown : Événement souris vers le bas
mouseUp : événement de libération de la souris
terminé : événement de réussite de copie

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!