Restrict user from copying their own text written in input feild

Question

I have one input box for email on my website

<input type="text" name="email" class="box" id="email" value="Enter your email">
<input type="text" name="confirmEmail" class="box" id="confirmEmail" value="Enter your email again">

By using css below we can restrict user from selecting any content

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

I wanted to know, is it possible to restrict user from copying their own written text in any input boxes? if yes how? I want my users to write their email two time instead of copy paste.

I know you are looking for css solution but it's not possible, so closed as a JS duplicate(P.S this is tagged with JS as well, so that's another reason for me to close) — Mr. Alien, Sep 02 '13 at 06:23
Why don't you just check if the two e-mail-addresses are equal instead of forcing the user to type it twice? — Vince, Sep 02 '13 at 06:23
I think the usual belief is that if you copy and paste, there's nothing preventing you from copying a wrong email address. If you have to type it out twice, you're unlikely to make the same typo both times. — Chris Hayes, Sep 02 '13 at 06:24
Use reference from this post - [enter link description here][1] [1]: http://stackoverflow.com/questions/1226574/disable-copy-paste-into-html-form-using-javascript — dadua, Sep 02 '13 at 06:25
I wonder why nobody has yet tried to force me to enter my name and address twice to check for typos... — I'm with Monica, Sep 02 '13 at 06:28

score 3 · Accepted Answer · answered Sep 02 '13 at 06:30

A bit of googling before posting here mate would be good...Anyway here is how to disable cut,copy and paste. Don't forget to include jQuery before the code below.

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

Validating an email with regular expression would help you for your scenario as well.

score 0 · Answer 2 · 2013-09-02T06:51:06.257

0

 document.getElementById("confirmEmail").addEventListener('paste',
    function(e){e.preventDefault()});

 document.getElementById("confirmEmail").addEventListener('drop',
   function(e){e.preventDefault()});

http://jsfiddle.net/vPXrR/1/

update

 document.getElementById("email").addEventListener('paste',
     function(e){e.preventDefault()});
 document.getElementById("email").addEventListener('drop',
    function(e){e.preventDefault()});

http://jsfiddle.net/vPXrR/2/

edited Sep 02 '13 at 06:51

answered Sep 02 '13 at 06:33

Preventing just the paste is a bad idea... A user can easily write their email address on the first field, select it , copy it, drag and drop it to the second field and then paste it to the first one... Disable cut + copy + paste to avoid the dodgy users...like me :D – Thanos Sep 02 '13 at 06:36
Type the email address on the second field, copy it...paste it in the first one :D – Thanos Sep 02 '13 at 06:46
@Thanos whew... now that was dodgy indeed :) – Sep 02 '13 at 06:51
I've researched this specific issue with email validation, so i can tell you that you need all 3 cut-copy-paste disabled in both fields to be sure.Never assume your users will follow your logic, always validate and take in consideration this: You are creating something that will be used by monkeys which are supervised by donkeys :D – Thanos Sep 02 '13 at 06:54
@Thanos he..he.. you got me at monkeys, yup now I ll be extra careful with any validation. – Sep 02 '13 at 07:03

Restrict user from copying their own text written in input feild

2 Answers2