Enter button firing twice


Why is the enter button firing this function twice? Tab onto the element and hit enter.

I suppose the default action of selecting an element with the keyboard is to trigger a click event on that element… so you can actually call event.preventDefault() inside the event.type === 'keydown' conditional to prevent the click event from getting dispatched. Personally I always found it quite nice not having to implement all that separately though. :-) So the simplest solution would be to remove the keydown handler altogether.

Thanks! Found this…
https://mdn.mozillademos.org/en-US/docs/Web/HTML/Element/input/button$samples/summary-example2?revision=1376410
So basically the click event is enough. Just curious why it was doing that, but it seems it’s on purpose. Thanks! Colleague asked me and I couldn’t figure out why this was behaving like this. Good to know we aren’t going crazy! Appreciate the help.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.