Maison >interface Web >js tutoriel >Le plug-in JQuery zClip implémente la copie du contenu de la page dans clipboard_jquery

Le plug-in JQuery zClip implémente la copie du contenu de la page dans clipboard_jquery

WBOY
WBOYoriginal
2016-05-16 15:34:061369parcourir

Je crois que tout le monde rencontre souvent cette fonction en surfant sur Internet. Je n'ai pas prêté beaucoup d'attention à la façon de la mettre en œuvre auparavant, jusqu'à ce qu'elle soit nécessaire dans le projet.

Effet final :

Après de nombreuses recherches sur Internet, il n'est pas impossible d'utiliser simplement la méthode js, mais en raison des différents mécanismes de sécurité de chaque navigateur, ce n'est pas multi-navigateur. J'ai vérifié plusieurs sites Web couramment utilisés, et ils utilisent tous du flash transparent pour couvrir le bouton "Copier dans le presse-papiers". Ainsi, lorsque vous cliquez sur "Copier dans le presse-papiers", ce sur quoi vous cliquez est en fait Flash, puis vous copiez le contenu que vous devez copier. . Il est transmis au flash, puis le contenu entrant est copié dans le presse-papiers via la fonction de copie du flash.
Charger la bibliothèque JQuery et le plug-in zclip

<script type="text/javascript" src="js/jquery-1.8.1.min.js"></script> 
<script src="js/jquery.zclip.min.js"></script> 

Ce qui suit est une petite démo, qui copie principalement le lien dans la zone de texte vers le presse-papiers.
HTML

<input type="text" value="www.jb51.net" id="link"> 
<span id="copyBtn">复制链接</span> 

Puis ajoutez le script

<script> 
    $('#copyBtn').zclip({ 
      path: "ZeroClipboard.swf", 
      copy: function(){ 
        return $('#link').val(); 
       } 
    }); 
</script> 

Ensuite, vous pouvez ouvrir directement la page Web pour tester. Ce n'est qu'une simple petite application, j'espère que tout le monde pourra la maîtriser rapidement.

Déclaration:
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