Javascript onfocus and enter key

Question

I have a login form which contains a username field, password field, and a submit button like so:

<form id="myform" name="myform" method="post" action="servlet/url">
  <label>Username:</label>
  <input type="text" name="username" value="user_name" placeholder="Username">
  <label>Password:</label>
  <input type="text" name="user_pwd" value="" placeholder="Password" onfocus="javascript:this.value=''">
  <input type="submit" value="Submit">
</form>

If I click the submit button, it works as expected. However, pressing the enter key clears the password value UNLESS I click out of the password field first. I know that this is because of my onfocus attribute, however I would still like the password field to clear away automatically if you click back into it. What could be the cause of the enter key clearing the field?

Use `onclick` instead of `onfocus`? – Barmar May 03 '17 at 15:42 — Barmar, May 03 '17 at 15:42
BTW, you don't need `javascript:` at the beginning. – Barmar May 03 '17 at 15:43 — Barmar, May 03 '17 at 15:43

score 1 · Answer 1 · answered May 03 '17 at 15:49

1

You could replace onfocus= with onclick=. The functionality is somewhat different however.

I should also note that I cannot reproduce your experience in Chrome, Firefox, IE, nor Edge.

answered May 03 '17 at 15:49

BrandonFlynn-NB

384
2
14

The only issue I have with onclick is that clicking the text box while it's already in focus clears the field, which I wanted to avoid. – samo May 03 '17 at 15:51
No, that's what I can't seem to figure out. I guess I should've focused my question on figuring out why that is instead of finding an alternate solution. – samo May 03 '17 at 16:09
I'd suggest disabling plugins and trying different browsers. – BrandonFlynn-NB May 03 '17 at 16:14

Javascript onfocus and enter key

1 Answers1