Search code examples
javascriptautocompleteenter

Trap the enter key, but not when choosing the browser's autocomplete suggestion

I have some textboxes on a page and I want to click a link when the user presses enter in any of them.

I can easily trap the enter button using javascript (by looking for 13 in event.keyCode and event.which), but I hit an issue when the browser's autocomplete feature kicks in and suggests what the user might want to type. We're finding the users often press enter to accept the browser's suggestion, rather than tab. This confuses the users as the link is clicked immediately, whereas they still intended to enter text into some of the other fields.

I know it would be better to use a form and a submit button here, but for various reasons that's not practical.

I'm using jQuery, so feel free to offer jQuery solutions.

Solution

  • User always have to press the down key if they choose to select one of the auto complete text right, why not set a variable to something when they press the down key, and then if they do the enter press afterwards you check the variable. You should not do the link click function if the variable is set, otherwise do it as normal.