web-dev-qa-db-fra.com

Comment désactiver le collage (Ctrl + V) avec jQuery?

Comment puis-je désactiver Coller (Ctrl+V) option utilisant jQuery dans l’un de mes champs de saisie?

javascriptjquerycopy-pastetextinput
65
Misam

Cela fonctionne maintenant correctement pour IE FF Chrome ... Je n'ai pas encore testé pour d'autres navigateurs 

$(document).ready(function(){
   $('#txtInput').on("cut copy paste",function(e) {
      e.preventDefault();
   });
});

Edit: Comme indiqué par webeno , .bind() est obsolète, il est donc recommandé d’utiliser .on() à la place.

164
Misam

Edit: C'est presque 6 ans plus tard, en regardant cela maintenant, je ne recommanderais pas cette solution. La réponse acceptée est définitivement bien meilleure. Allez avec ça!

Cela semble fonctionner.

Vous pouvez écouter événements au clavier avec jQuery et empêcher l’événement de se terminer si c’est la combinaison de touches que vous recherchez. Notez, cochez 118 et 86 (V et v)

Exemple de travail ici: http://jsfiddle.net/dannylane/9pRsx/4/

$(document).ready(function(){
    $(document).keydown(function(event) {
        if (event.ctrlKey==true && (event.which == '118' || event.which == '86')) {
            alert('thou. shalt. not. PASTE!');
            event.preventDefault();
         }
    });
});

Mise à jour: la frappe ne se déclenche pas dans IE, utilisez keydown à la place.

21
DannyLane

A partir de JQuery 1.7, vous pouvez utiliser la méthode on à la place.

$(function(){
    $(document).on("cut copy paste","#txtInput",function(e) {
        e.preventDefault();
    });
});
9
Steve Chan
jQuery('input.disablePaste').keydown(function(event) {
    var forbiddenKeys = new Array('c', 'x', 'v');
    var keyCode = (event.keyCode) ? event.keyCode : event.which;
    var isCtrl;
    isCtrl = event.ctrlKey
    if (isCtrl) {
        for (i = 0; i < forbiddenKeys.length; i++) {
            if (forbiddenKeys[i] == String.fromCharCode(keyCode).toLowerCase()) {
                 return false;
            }
        }
    }
    return true;
});
4
hawx

J'ai essayé cela dans mon projet angulaire et cela a bien fonctionné sans jQuery.

<input type='text' ng-paste='preventPaste($event)'>

Et dans la partie script:

$scope.preventPaste = function(e){
   e.preventDefault();
   return false;
};

Dans un projet non angulaire, utilisez 'onPaste' au lieu de 'ng-paste' et 'event' au lieu de '$ event'.

4
Abhishek

Le code suivant va désactiver couper, copier et coller de la page entière.

$(document).ready(function () {
   $('body').bind('cut copy paste', function (e) {
      e.preventDefault();
   });
});

Le tutoriel complet et la démo de travail peuvent être trouvés ici - Désactiver couper, copier et coller avec jQuery

2
JoyGuru

J'ai testé le problème sur le navigateur chrome et cela fonctionne pour moi. Voici une solution pour empêcher le code de coller dans votre zone de texte et également pour empêcher le clic droit.

   $(".element-container").find('input[type="text"]').live("contextmenu paste", function (e) {

    e.preventDefault();
});
0
Chirag Prajapati

Vous pouvez attraper un événement clé:

function checkEventObj ( _event_ ){
    // --- IE Explorer
    if ( window.event )
        return window.event;
    // --- Netscape and other explorers
    else
        return _event_;
}

document.keydown = function(_event) {
    var e = checkEventObject(_event);

    if( e.ctrlKey && (e.keyCode == 86) )
        window.clipboardData.clearData();
}

Non testé mais pourrait aider.

Source de comentcamarche et Zakaria

0
canardman

 $(document).ready(function(){
   $('#txtInput').on("cut copy paste",function(e) {
      e.preventDefault();
   });
});
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <input type="text" id="txtInput" />

0
Gtm
$(document).ready(function(){
  $('#txtInput').live("cut copy paste",function(e) {
    e.preventDefault();
  });
});

Sur les zones de texte, l'événement coupe, copie, collage est évité et fonctionne correctement.

0
Vikas Bansal