Milindu Sanoj Kumarage
Milindu Sanoj Kumarage

Reputation: 2783

Default behavior when press enter in HTML text input elements

I'm working on a cross-browser compatibility issue with HTML input fields.

On my Chrome 63.0, when I pressed enter in an input[type=text], it triggers change event, and no blur event is fired. ( I tired with this https://jsfiddle.net/agentmilindu/ekhT4/2984/ )

However, I see in some browsers, a blur event is triggered when pressing enter.

I see lot of question on StackOverflow asking how to stop triggering this blur event when enter is pressed,

  1. Prevent both blur and keyup events to fire after pressing enter in a textbox
  2. onkeypress + onblur in javascript

The app( a PhoneGap app written in React ) I'm currently investigating has a function which gets triggered by blur event when the user press enter, but in new browsers ( new phones and on my Chrom 63.0 also ) this is not working.

Now I'm confused what is the actual default behaviour when someone press enter in an input[type=text] filed. Should it be change+blur or only change? Is there any document which I can refer?

Upvotes: 1

Views: 2885

Answers (2)

Stefan Musarra
Stefan Musarra

Reputation: 1511

The HTML spec documents

https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#implicit-submission

say that the browser UserAgent may be set to cause the form to submit when Enter is depressed while focus is in an input "text" element.

According to:

https://www.tjvantoll.com/2013/01/01/enter-should-submit-forms-stop-messing-with-that/

“There are pages on the Web that are only usable 
if there is a way to implicitly submit forms, 
so user agents [browsers] are strongly encouraged 
to support this.”

Upvotes: 0

Rajkumar Somasundaram
Rajkumar Somasundaram

Reputation: 1270

I cant say much for apps, but for browsers; (i tried your fiddle in both chrome 61 and Firefox 55), these are my observations;

1) blur is triggered on focus out; text changes or not doesn't matter; if there is focus out, then blur triggers

2) change is triggered only if:

i)  text content changes within the input box changes
ii) enter key is pressed

either alone will not trigger change;

Hope this helps.

Upvotes: 0

Related Questions