jquery,javascript: change input value on keyup - keep cursor position at the end but

hey guys, i'm facing a little annoying bug that's in my case not really userfriendly.

The user is able to set values of an inputfield with the Up and Down Arrow keys. The focus is always set to the input field so the user is able to type after he has selected a value with the Arrow keys.

I want the Cursor Position to ALWAYS REMAIN at the last character of the input value so the user can type immediately after selecting a value via the arrow keys. That works just fine if you hit the down-arrow key because in that case the cursor automatically jumps to the end of the input-box.

Exactly the opposite happens if you press the up key - the cursor jumps to the beginning. I was able to fix that with a "setCursorPosition" Script i found here on stackoverflow.

However, despite the fact that it's working the user cannot really "feel and see" it. If I press the Up-Arrow key the cursor is still shown at the beginning of the input-value. As soon as I start typing the cursor jumps to the end and it works fine.

See it here: http://jsfiddle.net/3UHVY/1/

So I wonder if you have a solution so the cursor may always remain at the end of the input box when i hit the up or down arrow key and it's also visible and logic for the user. Right now the user might think he has to grab the mouse and jump right back to开发者_StackOverflow中文版 the input box to set the cursor to the end.

---

You can suppress the browser's default up-key behavior by returning false on key up:

if(e.keyCode === 38)
    return false;

http://jsfiddle.net/3UHVY/5/

Alternatively, if that doesn't satisfy your needs, you can hook on the keyUp event and move the cursor to the end of the input.