问题
When I select an item via keyboard arrows, the selection in the input field changes as expected. However if I then move the mouse out of the item, the input field reverts to whatever the user had typed, losing the selection previously made via the keyboard.
jsfiddle example
The documentation claims that what I'm trying to accomplish is in fact the default behavior, but it seems to not be working.
Another reference mentioning that the behavior seems to have changed: http://forum.jquery.com/topic/autocomplete-s-menu-items-mouseover-behavior#14737000002991273
I'm currently using jquery-rails 2.0.2, which pulls in jQuery-1.7.2.
回答1:
When I comment out the last line of Javascript in your fiddle, the expected behavior starts working again.
I'm not entirely sure why, but it looks like you were calling the autocomplete script twice and perhaps they were interfering with each other somehow.
回答2:
"Before focus is moved to an item (not selecting), ui.item refers to the focused item. The default action of focus is to replace the text field's value with the value of the focused item, though only if the focus event was triggered by a keyboard interaction. Canceling this event prevents the value from being updated, but does not prevent the menu item from being focused."
The Text abode is what describe focus event.
If you take a look it says The default action of focus is to replace the text field's value with the value of the focused item, though only if the focus event was triggered by a keyboard interaction.
So, as you can see this demo shows that the option get focus but the value don't change.
reference
来源：https://stackoverflow.com/questions/11586399/jquery-autocomplete-loses-selection-on-mouse-out