Maison > interface Web > js tutoriel > Comment copier du texte dans le presse-papiers du client avec jQuery ?

Comment copier du texte dans le presse-papiers du client avec jQuery ?

Susan Sarandon
Libérer: 2024-10-19 12:02:02
original
742 Les gens l'ont consulté

How to Copy Text to Client's Clipboard with jQuery?

Copier le texte dans le presse-papiers du client avec jQuery

La copie du texte dans le presse-papiers du client implique plusieurs étapes :

  1. Déclencher la copie en un clic dans une zone de texte.
  2. Transférez le texte sélectionné dans le presse-papiers.
  3. Fournissez des commentaires de l'utilisateur sur l'action.

Pour ce faire à l'aide de jQuery, suivez ces étapes :

  1. Incluez jQuery dans votre document HTML s'il n'est pas déjà présent.
<code class="html"><script src="https://code.jquery.com/jquery-3.6.0.min.js"></script></code>
Copier après la connexion
  1. Créez un élément textarea et attachez un écouteur d'événement à son événement de clic :
<code class="html"><textarea id="my-textarea"></textarea>

<script>
$( "#my-textarea" ).on( "click", function() {
  // Get the selected text
  var selectedText = $(this).val();

  // Clipboard API is not supported in all browsers
  if (!navigator.clipboard) {
    console.error("Clipboard API not supported");
    return;
  }

  // Set the selected text to the clipboard
  navigator.clipboard.writeText(selectedText).then(() => {
    // Success
    alert("Text copied to clipboard!");
  }, () => {
    // Error
    alert("Failed to copy text to clipboard");
  });
});
</script></code>
Copier après la connexion

Cette approche utilise l'API Clipboard, qui est prise en charge par la plupart des navigateurs modernes. Si votre public cible inclut des navigateurs plus anciens, envisagez d'utiliser une méthode de secours, telle que l'utilisation de ZeroClipboard ou Flash, comme décrit dans la réponse fournie.

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!

source:php
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal