2

An input element on a web page is defined like the following to prevent passwords being pasted in:

<input type="password" class="field" id="password" name="password" title="Enter your password" maxlength="50" onpaste="javascript:return false;" size="38" tabindex="2">

I want to enable pasting in this input field. Using Firebug or equivalent I can edit the onpaste function so the code is:

onpaste="javascript:return true;"

This is fine for me, but for other users, I want a simpler solution. What came to mind is that if I could give them some Javascript, they could open the console and paste in a simple one-liner. However when I tried to do this the Javascript had no effect. I tried the following and neither worked.

$('#password').onpaste=""
$('#password').onpaste="javascript:return true;"

What am I doing wrong?

apsillers
  • 112,806
  • 17
  • 235
  • 239
Phil
  • 1,897
  • 4
  • 25
  • 48

3 Answers3

3

The problem is that you're trying to combine jQuery with regular JavaScript. You can just use pure JavaScript to remove the onpaste listener.

document.getElementById('password').onpaste=""

If you want to use jQuery instead, you can use:

$('#password')[0].onpaste=""

which would give the same result.

Anonymous
  • 11,748
  • 6
  • 35
  • 57
  • Now excuse my ignorance, what is wrong with mixing jQuery and Javascript? Surely jQuery just get the element "password" and then we can use regular Javascript on the element ? – Phil Jun 19 '15 at 13:29
  • 1
    jQuery is returning its own object that stores a reference to the element. What you need is the element itself. The jQuery object has certain properties attached to it, but onpaste is not one of them. – Anonymous Jun 19 '15 at 13:30
  • So can I turn a jQuery object back into a "regular DOM object" (sorry I'm sure I'm getting the terminology horribly wrong here!!!!) – Phil Jun 19 '15 at 13:31
  • Thanks for the link. I've discovered that $('#password')[0].onpaste="" would have the same effect. Thank you @Anonymous for the solution and the explanation. – Phil Jun 19 '15 at 13:35
  • @Phil Yes, it would, but I always prefer to use pure JavaScript. :) – Anonymous Jun 19 '15 at 13:36
2

Just remove the onpaste attribute of the DOM element, not of the jQuery object which does not have a onpaste property. Your code is creating a property (set to a string) that is just being ignored.

In the example below, you can click the button and paste will be re-enabled.

document.querySelector('button').addEventListener('click', function() {
    document.getElementById('password').removeAttribute('onpaste');
})
<input type="password" class="field" id="password" name="password" title="Enter your password" maxlength="50" onpaste="javascript:return false;" size="38" tabindex="2">

<button>Allow pasting</button>
Ruan Mendes
  • 90,375
  • 31
  • 153
  • 217
  • Nice solution. Thanks. – Phil Jun 19 '15 at 13:29
  • this extension skips the onpaste restriction https://chrome.google.com/webstore/detail/dont-fuck-with-paste/nkgllhigpcljnhoakjkgaieabnkmgdkb – humano Mar 09 '20 at 17:59
  • @humano But it's kind of useless unless you can get all users of your website/webapp to install it. Requiring a plugin for your app seems like a bad idea – Ruan Mendes Mar 12 '20 at 12:25
1
$('#password').onpaste=""
$('#password').onpaste="javascript:return true;"

Are not valid functions. For firing event which comes from paste, you must write function like this

$('#password').bind("paste", function(e) {
    callback();
});

But solution for your question is here http://jsfiddle.net/9et20v36/, in click function from button allow, I remove onclick attribute from input which allows to paste text.

So for pure javascript use

document.getElementById('password').removeAttribute('onpaste');

or jQuery way

$('#password').prop('onpaste', null);
Jozef Dúc
  • 965
  • 2
  • 18
  • 29
  • Ok, as a simple solution, how can I just clear the onpaste function? Is this valid: $('#password').bind("paste", null) ? – Phil Jun 19 '15 at 13:10
  • @Phil what do you mean by "clear"? Function which does nothing or which prevents from bubbling an event up...? – Jozef Dúc Jun 19 '15 at 13:12
  • What I meant by clear was to remove all bound paste functions – Phil Jun 19 '15 at 13:27