Le plug-in jQuery Zclip réalise une compatibilité parfaite avec tous les navigateurs et clique pour copier le contenu dans clipboard_jquery

Dans le développement WEB, les utilisateurs sont invités à copier un morceau de code, l'adresse URL et d'autres informations sur la page. Afin d'éviter d'éventuelles erreurs lorsque l'utilisateur fait glisser la souris puis clique avec le bouton droit pour copier, nous pouvons le placer directement. un bouton de copie sur la page. Cliquez simplement sur ce bouton de copie, le contenu sera copié, puis l'utilisateur pourra le coller là où il souhaite le coller.

HTML

Tout d'abord, vous devez charger la bibliothèque jquery et le plug-in zclip dans la page. Ces deux fichiers ont été empaquetés. Vous pouvez cliquer pour télécharger.

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

Ensuite, nous ajoutons le code suivant dans la partie corps de la page :

<textarea id="mytext">请输入内容</textarea><br/> 
<a href="#" id="copy_input" class="copy">复制内容</a>

Une zone de texte de zone de saisie est placée sur la page. Bien sûr, il peut également s'agir d'autres éléments HTML, puis il y a un bouton de copie, qui peut également se présenter sous la forme d'un texte de lien.

Javascript

Lorsque vous cliquez sur "Copier le contenu", le plug-in zclip est appelé et la copie est réussie. Veuillez consulter le code :
.

$(function(){ 
  $('#copy_input').zclip({ 
    path: 'js/ZeroClipboard.swf', 
    copy: function(){//复制内容 
      return $('#mytext').val(); 
    }, 
    afterCopy: function(){//复制成功 
      $("<span id='msg'/>").insertAfter($('#copy_input')).text('复制成功'); 
    } 
  }); 
}); 

Il est à noter que si le contenu copié provient d'une zone de saisie, d'une zone de texte, etc., utilisez l'objet de copie :

copy: function(){ 
  return $('#mytext').val(); 
} 

Si le contenu copié provient d'éléments de page div, p, etc., utilisez l'objet copy :
copie : $('#montexte').text();
Ceci complète la fonction de copie du contenu dans le presse-papiers.
Description du paramètre
chemin : chemin d'appel swf, obligatoire, tel que js/ZeroClipboard.swf, le fichier ZeroClipboard.swf existe déjà dans le package de téléchargement.
copy : Le contenu copié doit être n'importe quelle chaîne, ou il peut s'agir du contenu renvoyé par la fonction de rappel
beforeCopy : fonction de rappel avant de copier du contenu, facultatif
afterCopy : fonction de rappel après copie du contenu, facultatif

Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.