Como detectar Ctrl + V, Ctrl + C usando JavaScript?

Como detectar ctrl+ v, ctrl+ cusando Javascript?

Preciso restringir a colar nas minhas áreas de texto, o usuário final não deve copiar e colar o conteúdo, o usuário deve digitar apenas o texto na área de texto.

Como conseguir isso?

Eu apenas fiz isso por interesse. Concordo que não é a coisa certa a ser feita, mas acho que deve ser a decisão do op ... Também o código pode ser facilmente estendido para adicionar funcionalidade, em vez de removê-la (como uma área de transferência mais avançada ou Ctrl+ sacionar um servidor lado salvar).

$(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 && (e.keyCode == vKey || e.keyCode == cKey)) return false;
    });
    
    // Document Ctrl + C/V 
    $(document).keydown(function(e) {
        if (ctrlDown && (e.keyCode == cKey)) console.log("Document catch Ctrl+C");
        if (ctrlDown && (e.keyCode == vKey)) console.log("Document catch Ctrl+V");
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h3>Ctrl+c Ctrl+v disabled</h3>
<textarea class="no-copy-paste"></textarea>
<br><br>
<h3>Ctrl+c Ctrl+v allowed</h3>
<textarea></textarea>

Também apenas para esclarecer, esse script requer a biblioteca jQuery.

Codepen demo

EDIT: removeu 3 linhas redundantes (envolvendo e.which) graças à sugestão de Tim Down (ver comentários)

EDIT: adicionado suporte para Macs ( cmdchave em vez de ctrl)

Com o jquery você pode facilmente detectar copiar, colar, etc, vinculando a função:

$("#textA").bind('copy', function() {
    $('span').text('copy behaviour detected!')
}); 
$("#textA").bind('paste', function() {
    $('span').text('paste behaviour detected!')
}); 
$("#textA").bind('cut', function() {
    $('span').text('cut behaviour detected!')
});

Mais informações aqui: http://www.mkyong.com/jquery/how-to-detect-copy-paste-and-cut-behavior-with-jquery/

Embora possa ser irritante quando usado como uma medida antipirataria, posso ver que pode haver alguns casos em que seria legítimo, então:

function disableCopyPaste(elm) {
    // Disable cut/copy/paste key events
    elm.onkeydown = interceptKeys

    // Disable right click events
    elm.oncontextmenu = function() {
        return false
    }
}

function interceptKeys(evt) {
    evt = evt||window.event // IE support
    var c = evt.keyCode
    var ctrlDown = evt.ctrlKey||evt.metaKey // Mac support

    // Check for Alt+Gr (http://en.wikipedia.org/wiki/AltGr_key)
    if (ctrlDown && evt.altKey) return true

    // Check for ctrl+c, v and x
    else if (ctrlDown && c==67) return false // c
    else if (ctrlDown && c==86) return false // v
    else if (ctrlDown && c==88) return false // x

    // Otherwise allow
    return true
}

Eu usei, em event.ctrlKeyvez de verificar o código da chave, como na maioria dos navegadores nos eventos Mac OS X Ctrl/ Alt"down" e "up" nunca são acionados, portanto, a única maneira de detectar é usar event.ctrlKeyo evento eg c após a Ctrltecla ser pressionada. pressionado. Eu também substituído ctrlKeycom metaKeypara Macs.

Limitações deste método:

• O Opera não permite desativar eventos de clique direito

• Arraste e solte entre as janelas do navegador não podem ser evitadas até onde eu sei.

• O item de menu edit-> copyno Firefox, por exemplo, ainda pode permitir copiar / colar.

• Também não há garantia de que, para pessoas com diferentes layouts / localizações de teclado, copiar / colar / recortar sejam os mesmos códigos de tecla (embora os layouts geralmente sigam o mesmo padrão do inglês), mas a opção "desativar todas as teclas de controle" significa que você seleciona tudo, etc. também será desativado, então acho que é um compromisso que precisa ser feito.

Há uma outra maneira de fazer isso: onpaste , oncopye oncutos eventos podem ser registrados e cancelado no IE, Firefox, Chrome, Safari (com alguns pequenos problemas), o único grande navegador que não permite cancelar esses eventos é Opera.

Como você pode ver na minha outra resposta, a interceptação de Ctrl+ ve Ctrl+ cvem com muitos efeitos colaterais, e ainda não impede que os usuários colem usando o Editmenu do Firefox etc.

function disable_cutcopypaste(e) {
    var fn = function(evt) {
        // IE-specific lines
        evt = evt||window.event
        evt.returnValue = false

        // Other browser support
        if (evt.preventDefault) 
            evt.preventDefault()
        return false
    }
    e.onbeforepaste = e.onbeforecopy = e.onbeforecut = fn
    e.onpaste = e.oncopy = e.oncut = fn
}

O Safari ainda tem alguns pequenos problemas com esse método (ele limpa a área de transferência no lugar de recortar / copiar ao impedir o padrão), mas esse bug parece ter sido corrigido no Chrome agora.

Consulte também: http://www.quirksmode.org/dom/events/cutcopypaste.html e a página de teste associada http://www.quirksmode.org/dom/events/tests/cutcopypaste.html para obter mais informações.

Demonstração ao vivo: http://jsfiddle.net/abdennour/ba54W/

$(document).ready(function() {

    $("#textA").bind({
        copy : function(){
            $('span').text('copy behaviour detected!');
        },
        paste : function(){
            $('span').text('paste behaviour detected!');
        },
        cut : function(){
            $('span').text('cut behaviour detected!');
        }
    });

}); 

Solução curta para impedir que o usuário use o menu de contexto, copie e recorte no jQuery:

jQuery(document).bind("cut copy contextmenu",function(e){
    e.preventDefault();
});

Desabilitar também a seleção de texto em CSS pode ser útil:

.noselect {  
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
     user-select: none;
}

Se você usar a ctrlKeypropriedade, não precisará manter o estado.

   $(document).keydown(function(event) {
      // Ctrl+C or Cmd+C pressed?
      if ((event.ctrlKey || event.metaKey) && event.keyCode == 67) {
         // Do stuff.
      }

      // Ctrl+V or Cmd+V pressed?
      if ((event.ctrlKey || event.metaKey) && event.keyCode == 86) {
         // Do stuff.
      }

      // Ctrl+X or Cmd+X pressed?
      if ((event.ctrlKey || event.metaKey) && event.keyCode == 88) {
         // Do stuff.
      } 
    }

Eu escrevi um plugin jQuery, que captura as teclas digitadas. Ele pode ser usado para ativar a entrada de scripts de vários idiomas em formulários html sem o sistema operacional (exceto as fontes). São cerca de 300 linhas de código, talvez você queira dar uma olhada:

• http://miku.github.com/jquery-retype

Geralmente, tenha cuidado com esse tipo de alteração. Eu escrevi o plugin para um cliente porque outras soluções não estavam disponíveis.

Você pode usar esse código para clicar com o botão direito, CTRL+ C, CTRL+ V, CTRL+ Xdetectar e impedir sua ação

$(document).bind('copy', function(e) {
        alert('Copy is not allowed !!!');
        e.preventDefault();
    }); 
    $(document).bind('paste', function() {
        alert('Paste is not allowed !!!');
        e.preventDefault();
    }); 
    $(document).bind('cut', function() {
        alert('Cut  is not allowed !!!');
        e.preventDefault();
    });
    $(document).bind('contextmenu', function(e) {
        alert('Right Click  is not allowed !!!');
        e.preventDefault();
    });

em vez de onkeypress, use onkeydown.

<input type="text" onkeydown="if(event.ctrlKey && event.keyCode==86){return false;}" name="txt">

Outra abordagem (nenhum plug-in necessário) é usar apenas a ctrlKeypropriedade do objeto de evento que é passado. Indica se Ctrlfoi pressionado no momento do evento, assim:

$(document).keypress("c",function(e) {
  if(e.ctrlKey)
    alert("Ctrl+C was pressed!!");
});

Veja também jquery: pressionamento de tecla, ctrl + c (ou algum combo assim) .

Não se esqueça de que, embora seja possível detectar e bloquear Ctrl+ C/ V, você ainda pode alterar o valor de um determinado campo.
O melhor exemplo disso é a função Inspect Element do Chrome, que permite alterar a propriedade de valor de um campo.

eu já tenho seu problema e resolvi-o pelo código a seguir .. que aceita apenas números

$('#<%= mobileTextBox.ClientID %>').keydown(function(e) {
            ///// e.which Values
            // 8  : BackSpace , 46 : Delete , 37 : Left , 39 : Rigth , 144: Num Lock 
            if (e.which != 8 && e.which != 46 && e.which != 37 && e.which != 39 && e.which != 144
                && (e.which < 96 || e.which > 105 )) {
                return false;
            }
        });

você pode detectar Ctrlide.which == 17

Você pode ouvir o evento de pressionamento de tecla e interromper o evento padrão (digitando o texto) se ele corresponder aos códigos de tecla específicos

Nota importante

Eu estava usando e.keyCodepor um tempo e descobri que quando pressiono ctrl+ ., este atributo retorna um número errado, 190, enquanto o código ascii .é 46!

Então você deve usar em e.key.toUpperCase().charCodeAt(0)vez de e.keyCode.

Existem algumas maneiras de evitá-lo.

No entanto, o usuário sempre poderá desativar o javascript ou apenas olhar o código-fonte da página.

Alguns exemplos (requerem jQuery)

/**
* Stop every keystroke with ctrl key pressed
*/
$(".textbox").keydown(function(){
    if (event.ctrlKey==true) {
        return false;
    }
});

/**
* Clear all data of clipboard on focus
*/
$(".textbox").focus(function(){
    if ( window.clipboardData ) {
        window.clipboardData.setData('text','');
    }
});

/**
* Block the paste event
*/
$(".textbox").bind('paste',function(e){return false;});

Edit: Como Tim Down disse, essas funções são todos dependentes do navegador.