colar texto Disable em formato HTML

Question

Existe uma maneira usando JavaScript para desativar a capacidade de colar texto em um campo de texto em um formulário HTML?

por exemplo. Eu tenho um formulário de registo simples onde o usuário é obrigado a inserir seu e-mail duas vezes. A segunda entrada de e-mail é para verificar se não existem erros de digitação na primeira entrada de e-mail. No entanto, se a cópia do usuário / cola o seu e-mail, em seguida, que derrota o propósito e eu tenho experimentado usuários que têm problemas, porque eles têm de entrada do e-mail errado e copiar / colar-lo.

Talvez eu não estava claro na minha pergunta, mas eu não estou tentando impedir as pessoas de copiar (ou seleccionando o arrasto) de texto no seu browser. Eu só quero impedi-los de colar de entrada para um campo de texto para minimizar o erro do usuário.

Talvez em vez de usar este "hack" pode sugerir uma outra solução para o problema central do que eu estou tentando resolver aqui? Eu fiz menos do que os testes de usuário meia dúzia e isso já aconteceu duas vezes. Meu público não tem um alto nível de proficiência computador.

Answer 1

Recentemente, tive a contragosto desativar colando em um elemento de formulário. Para fazer isso, eu escrevi um cross-browser * implementação do Internet Explorer (e outros) onpaste manipulador de eventos. Minha solução tinha que ser independente de quaisquer de terceiros bibliotecas JavaScript.

Aqui está o que eu vim acima com. Não desativar completamente o colar (o usuário pode colar um único caractere de cada vez, por exemplo), mas atende as minhas necessidades e evita ter que lidar com os códigos de teclas, etc.

// Register onpaste on inputs and textareas in browsers that don't
// natively support it.
(function () {
    var onload = window.onload;

    window.onload = function () {
        if (typeof onload == "function") {
            onload.apply(this, arguments);
        }

        var fields = [];
        var inputs = document.getElementsByTagName("input");
        var textareas = document.getElementsByTagName("textarea");

        for (var i = 0; i < inputs.length; i++) {
            fields.push(inputs[i]);
        }

        for (var i = 0; i < textareas.length; i++) {
            fields.push(textareas[i]);
        }

        for (var i = 0; i < fields.length; i++) {
            var field = fields[i];

            if (typeof field.onpaste != "function" && !!field.getAttribute("onpaste")) {
                field.onpaste = eval("(function () { " + field.getAttribute("onpaste") + " })");
            }

            if (typeof field.onpaste == "function") {
                var oninput = field.oninput;

                field.oninput = function () {
                    if (typeof oninput == "function") {
                        oninput.apply(this, arguments);
                    }

                    if (typeof this.previousValue == "undefined") {
                        this.previousValue = this.value;
                    }

                    var pasted = (Math.abs(this.previousValue.length - this.value.length) > 1 && this.value != "");

                    if (pasted && !this.onpaste.apply(this, arguments)) {
                        this.value = this.previousValue;
                    }

                    this.previousValue = this.value;
                };

                if (field.addEventListener) {
                    field.addEventListener("input", field.oninput, false);
                } else if (field.attachEvent) {
                    field.attachEvent("oninput", field.oninput);
                }
            }
        }
    }
})();

Para fazer uso deste, a fim de desativar colando:

<input type="text" onpaste="return false;" />

---

* Eu sei oninput não é parte da especificação W3C DOM, mas todos os navegadores que eu testei este código com-Chrome 2, Safari 4, o Firefox 3, Opera 10, IE6, IE7-apoio, quer oninput ou onpaste. Fora de todos esses navegadores, apenas a Opera não suporta onpaste, mas ele faz suporte oninput.

Nota: Este não irá funcionar em um console ou outro sistema que usa um teclado na tela (assumindo que o teclado na tela não envia as chaves para o navegador quando cada tecla é selecionado). Se for possível sua página / app poderia ser usado por alguém com um teclado na tela e Opera (por exemplo: Nintendo Wii, alguns telefones celulares), não use este script, a menos que você tenha testado para garantir que o teclado na tela envia as chaves para o navegador após cada seleção chave.

Answer 2

Não faça isso. Não mexa com o navegador do usuário. Ao copiar + colar em um campo de confirmação de e-mail, o usuário aceita a responsabilidade sobre o que escrever. Se eles são suficientemente estúpido para copiar + colar o endereço de um defeito (que me aconteceu), então é sua própria culpa.

Se você quiser ter certeza de que a confirmação de e-mail funciona, que o usuário verifique seus e-mails enquanto o site espera ( "Por favor, abra o seu programa de webmail em uma nova janela"). Mostrar o endereço de e-mail em letras grandes de gordura ( "A confirmação de e-mail foi enviado para .... cometeu um erro? Clique aqui para alterar).

Ainda melhor, se você puder, deixe o usuário tem algum tipo de acesso limitado sem confirmar. Dessa forma, eles podem logar-se imediatamente e a melhorar suas chances de manter contato com o visitante, mesmo se o e-mail de confirmação é bloqueada devido a outras razões (por exemplo, filtros de spam).

Answer 3

Adicionar uma classe de 'disablecopypaste' às entradas que você deseja desativar a funcionalidade de copiar colar sobre e adicionar esse script jQuery

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

Answer 4

Só tenho isso, podemos alcançá-lo usando onpaste:"return false", graças a: http://sumtips.com/2011/11/prevent-copy-cut-paste-text-field.html

Temos várias outras opções disponíveis conforme listado abaixo.

<input type="text" onselectstart="return false" onpaste="return false;" onCopy="return false" onCut="return false" onDrag="return false" onDrop="return false" autocomplete=off/><br>

Answer 5

Você pode ..... mas não.

Você não deve estar alterando o comportamento padrão de um navegador usuários. É realmente má usabilidade para sua aplicação web. Além disso, se um usuário quer desativar este hack em seguida, eles podem simplesmente desabilitar o JavaScript no seu navegador.

Basta adicionar esses atributos para a caixa de texto

ondragstart=”return false” onselectstart=”return false”

Answer 6

idéia louca: Exigir que o usuário envie um e-mail como parte do processo de inscrição. Este seria, obviamente, inconveniente quando clicar em um link mailto não funciona (se eles estão usando webmail, por exemplo), mas eu vejo isso como uma forma de garantia simultaneamente contra erros e confirmar o endereço de e-mail.

Seria assim: Eles preencher a maior parte do formulário, escrevendo seu nome, senha e outros enfeites. Quando eles empurram apresentar, eles estão realmente clicar em um link para enviar email para o servidor. Você já salvou sua disposição outras informações, para que a mensagem inclui apenas um ditado sinal que conta isto é para.

Answer 7

Como sobre o envio de um email de confirmação para o endereço de e-mail que o usuário acaba de entrar duas vezes em que há um link para um URL de confirmação em seu site, então você sabe que eles têm a mensagem?

Qualquer um que não clique para confirmar o recebimento do e-mail pode ter entrado no seu endereço de email incorretamente.

Nem uma solução perfeita, mas apenas algumas idéias.

Answer 8

@boycs resposta, eu recomendaria também usando "on".

$('body').on('copy paste', 'input', function (e) { e.preventDefault(); });

Answer 9

Você pode usar jQuery

arquivo HTML

<input id="email" name="email">

código jQuery

$('#email').bind('copy paste', function (e) {
        e.preventDefault();
    });

Answer 10

Se você tem que usar 2 campos de e-mail e estão preocupados com o usuário incorretamente colar o mesmo e-mail digitado incorretamente do campo 1 para o campo 2, então eu diria que mostrar um alerta (ou algo mais sutil) se o utilizador cola algo no segundo campo de e-mail

document.querySelector('input.email-confirm').onpaste = function(e) {
    alert('Are you sure the email you\'ve entered is correct?');
}

Desta forma você não desativar colar, você apenas dar-lhes um lembrete amigável para verificar o que eles presumivelmente digitado no primeiro campo e, em seguida, colado ao segundo campo é correto.

No entanto, talvez um único campo de e-mail com autocomplete é sobre tudo que é necessário. Provavelmente, eles já preenchido o seu e-mail corretamente antes em outro site em algum ponto e o navegador irá sugerir para preencher o campo com o e-mail

<input type="email" name="email" required autocomplete="email">

Answer 11

Você pode anexar um ouvinte "keydown" para a caixa de entrada para detectar ou não as teclas Ctrl + V estão sendo pressionado e, em caso afirmativo, parar o evento ou definir o valor da caixa de entrada para ''.

Isso não iria lidar com o botão direito e colar ou colar a partir do menu Editar do navegador, no entanto. Pode ser necessário adicionar um contador de "último comprimento" para o ouvinte keydown e usar um intervalo para verificar o comprimento atual do campo para ver se ele aumentar desde a última tecla.

Nem é recomendado, no entanto. campos de formulário com colar desativado são extremamente frustrante. Eu sou capaz de escrever o meu e-mail corretamente na primeira vez, então eu reservamos o direito de colá-lo na segunda caixa.

Answer 12

Adicionar um segundo passo para o processo de registro. Primeira página, como de costume, mas na recarga, exibir uma segunda página e pedir ao e-mail novamente. Se é assim tão importante, o usuário pode lidar com isso.

Answer 13

de

Alguns podem sugerir o uso de Javascript para capturar as ações dos usuários, como o botão direito do mouse o mouse ou as combinações de teclas Ctrl + C / Ctrl + V e, em seguida, parar a operação. Mas este não é, obviamente, o melhor ou mais simples solução. A solução é integrada nas propriedades do campo de entrada em si, juntamente com algum evento captura usando Javascript.

Para desativada autocomplete dos navegadores, basta adicionar o atributo para o campo de entrada. Deve ser algo como isto:

<input type="text" autocomplete="off">

E se você deseja negar Copiar e Colar para esse campo, basta adicionar o evento Javascript capturar chamadas oncopy, onpaste e oncut e fazê-los retornar falso, assim:

<input type="text" oncopy="return false;" onpaste="return false;" oncut="return false;">

O próximo passo é usar onselectstart negar seleção de conteúdo do campo de entrada do usuário, mas lembre-se: isso só funciona para o Internet Explorer. O resto do grande trabalho acima em todos os principais navegadores:. Internet Explorer, Mozilla Firefox, o Apple Safari (no Windows OS, pelo menos) e Google Chrome

Answer 14

Verifique a validade do registro MX do host do e-mail fornecido. Isto pode eliminar erros à direita do sinal @.

Você pode fazer isso com uma chamada de AJAX antes de enviar e / ou do lado do servidor depois que o formulário é enviado.

Answer 15

Eu uso essa solução baunilha JS:

const element = document.getElementById('textfield')
element.addEventListener('paste', e =>  e.preventDefault())

Answer 16

Com jQuery você pode fazer isso com um codeline simples.

HTML:

<input id="email" name="email">

Código:

$(email).on('paste', false);

jsFiddle: https://jsfiddle.net/ZjR9P/2/

Answer 17

que sobre o uso CSS em UIWebView? algo como

<style type="text/css">
<!—-
    * {
        -webkit-user-select: none;
    }
-->
</style>

Além disso, você pode ler detalhes sobre bloco de copiar e colar usando CSS http: // rakaz. nl / 2009/09 / iphone-webapps-101-obter-safari-out-of-the-way.html

Answer 18

Uma solução simples: basta inverter o processo de registo: em vez de exigir confirmação no final do processo de registro, pedido de confirmação no início do mesmo! Ou seja, o processo de registo começou com um formulário simples pedindo endereço de e-mail e nada mais. Após a apresentação, um e-mail com link para uma página de confirmação exclusivo para o endereço de e-mail enviado para fora. O usuário ir para essa página, então o resto de informação para o registo (nome de usuário, nome completo, etc.) será solicitado.

Esta é simples, já que o site nem sequer necessidade de armazenar qualquer coisa antes da confirmação, o endereço de e-mail podem ser criptografados com uma chave e anexado como parte do endereço da página de confirmação.

Answer 19

Eu fiz algo semelhante a este para http://bookmarkchamp.com - lá eu queria para detectar quando um usuário copiado algo em um campo HTML. A implementação eu vim com foi o de verificar o campo constantemente para ver se em algum momento houve de repente um monte de texto lá dentro.

Em outras palavras:. Se uma vez milisecond atrás havia nenhum texto, e agora existem mais de 5 caracteres ... então o usuário provavelmente colados algo no campo

Se você quiser ver este trabalho em Bookmarkchamp (você precisa ser registrado), cole a URL no campo URL (ou arrastar e soltar um URL lá).

Answer 20

A maneira que eu iria resolver a questão da confirmação de um endereço de e-mail é o seguinte:

1. Antes de passar pelo processo principal - dizem registrar o usuário -. Primeiro pedir-lhes para inserir seu endereço de e-mail
2. Gerar um código único e enviá-lo para o endereço de e-mail.
3. Se o usuário entrou o endereço correto, eles vão obter o código.
4. O usuário deve digitar esse código, juntamente com seu endereço de email, e sua outra informação necessária, para que eles possam concluir o registro. -. Nota Por favor que se desta vez eles entram em um endereço de e-mail errado (ou um código errado), porque ele não vai combinar com o código, o registro não vai passar, eo usuário será informado de imediato
5. Se o endereço de e-mail, o código e outras informações de registro foram introduzidos correctamente, o registo está completo e usuário pode começar a usar o sistema imediatamente. - não há necessidade de responder a qualquer outro endereço de e-mail para ativar sua conta

Para maior segurança, o código deve ter um tempo de vida limitado, e deve ser permitida apenas uma vez no processo de registro. Além disso, a fim de evitar quaisquer aplicações para robôs maliciosos, é melhor para acompanhar o primeiro passo com captcha ou um mecanismo similar.

Answer 21

Usando jQuery, você pode evitar a pasta de cópia e corte usando este

$('.textboxClass').on('copy paste cut', function(e) {
    e.preventDefault();
});

Answer 22

Hope below code will work :

<!--Disable Copy And Paste-->
<script language='JavaScript1.2'>
function disableselect(e){
return false
}
function reEnable(){
return true
}
document.onselectstart=new Function ("return false")
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
</script>