Maison >interface Web >js tutoriel >Comment désactiver le copier-coller dans les zones de texte avec JavaScript ?

Comment désactiver le copier-coller dans les zones de texte avec JavaScript ?

Patricia Arquette
Patricia Arquetteoriginal
2024-11-02 22:11:02900parcourir

How to Disable Copying and Pasting in Textareas with JavaScript?

Méthode avancée pour désactiver le copier-coller à l'aide de JavaScript

Dans le développement Web, empêcher les utilisateurs finaux de coller du contenu dans des zones de texte peut être nécessaire pour l’intégrité des données ou l’expérience utilisateur. Pour y parvenir, un code JavaScript personnalisé peut fournir une solution.

Mise en œuvre :

  1. Détecter les événements d'appui sur la touche et savoir si Ctrl ou La touche Cmd est enfoncée.
  2. Dans le gestionnaire d'événements keydown, vérifiez si l'utilisateur appuie sur Ctrl ou Cmd avec V (coller) ou C (copier).
  3. Si la combinaison de touches détectée correspond à Ctrl/Cmd V ou Ctrl/Cmd C , empêchez l'opération de collage ou de copie en renvoyant false.

Exemple de code :

<code class="javascript">$(document).ready(function() {
    var ctrlDown = false,
        ctrlKey = 17,
        cmdKey = 91,
        vKey = 86,
        cKey = 67;

    $(document).keydown(function(e) {
        if (e.keyCode == ctrlKey || e.keyCode == cmdKey) ctrlDown = true;
    }).keyup(function(e) {
        if (e.keyCode == ctrlKey || e.keyCode == cmdKey) ctrlDown = false;
    });

    $(".no-copy-paste").keydown(function(e) {
        if (ctrlDown &amp;&amp; (e.keyCode == vKey || e.keyCode == cKey)) return false;
    });
    
    // Document Ctrl + C/V 
    $(document).keydown(function(e) {
        if (ctrlDown &amp;&amp; (e.keyCode == cKey)) console.log("Document catch Ctrl+C");
        if (ctrlDown &amp;&amp; (e.keyCode == vKey)) console.log("Document catch Ctrl+V");
    });
});</code>

Utilisation :

Pour utiliser ce code, appliquez la classe CSS "no-copy-paste" aux zones de texte dans lesquelles vous souhaitez désactiver le copier-coller. Dans les zones de texte sans cette classe, le copier-coller fonctionnera normalement.

Remarque : Cette solution peut ne pas convenir à toutes les applications, car elle empêche l'utilisateur d'utiliser des raccourcis clavier standards tels que Ctrl ou Cmd F pour rechercher/rechercher. Il est important de peser les compromis entre convivialité et sécurité avant de mettre en œuvre cette mesure.

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!

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