2

I have a <button> (not type="submit) and an <input type="text"/> on the same page.

They are not inside a form and the button is many levels above the input hierarchically.

The text input listens for keyup events and performs a custom action that has nothing to do with what the button does.

However, on IE10, when the Enter key is pressed, the button is triggered and the text input never gets the key. Chrome, Firefox and Opera (latest all 3) are fine.

I made the button turn red when its :active state is triggered. When you focus on the input, the button doesn't change, however after pressing Enter, it turns red.

Setting tabindex="-1" on the button doesn't change anything.

The workarounds I found are:

  • Listen for keydown on input and preventDefault(). Seems keyup is too late.
  • Place the input in a form container

I dislike both, especially the second. Is there anything else I can do?
Hoping this is something someone came up against.

EDIT: Here's a working example: http://plnkr.co/edit/LhmTpk5TpWDjOJUD18Bm?p=preview

Thank you.

Francisc
  • 77,430
  • 63
  • 180
  • 276
  • 1
    Which IE version(s) have you tested this with? Is it consistent across all versions? Can you provide a working demo (eg on jsFiddle, jsBin, etc) to demonstrate it? – Spudley Jan 20 '14 at 16:05
  • IE10, I can't make a Fiddle right now, but I will if no one encountered this before. I'll add the version to the tags. Thanks. – Francisc Jan 20 '14 at 16:06
  • http://stackoverflow.com/a/925387/1306811 :: IE seems to define the active button as the one that is defined first in the source. No way to test that currently, but it's quite the answer so it may help! – Gorbles Jan 20 '14 at 16:19
  • Gave that a very quick glance. The thing is my button is not a submit input element and neither of the 2 elements are inside a form. Actually, there are no forms on the page. Thanks. – Francisc Jan 20 '14 at 16:21

1 Answers1

0

Unfortunately, I think preventDefault() is your best bet.

Earlier versions of IE (please remember to post the version you're testing on!) are notorious for incompatibilities (ironically through incredibly strict interpretation of HTML schema).

EDIT: sorry for the "answer", darned site won't let me comment until I hit 50 Reputation.

Gorbles
  • 1,169
  • 12
  • 27