使用箭头键在文本输入字段中导航并返回

Question

我正在尝试使用jQuery在多个输入字段之间构建一种简单的导航机制。代码的第一部分，通过使用向下箭头或return键跳过向下可以很好地工作，但当我通过查找向上箭头然后颠倒顺序添加第二个块以向后移动时，在第一个文本字段中键入的内容会立即跳到第二个文本字段。有什么想法吗？

<script type="text/javascript">
$(document).ready(function(){
    // get only input tags with class data-entry
    textboxes = $("input.data-entry");
    // now we check to see which browser is being used
    if ($.browser.mozilla) {
        $(textboxes).keypress (checkForAction);
    } else {
        $(textboxes).keydown (checkForAction);
    }
});

function checkForAction (event) {
    if (event.keyCode == 13 || 40) {
          currentBoxNumber = textboxes.index(this);
        if (textboxes[currentBoxNumber + 1] != null) {
            nextBox = textboxes[currentBoxNumber + 1]
            nextBox.focus();
            nextBox.select();
            event.preventDefault();
            return false;
        }
    }
    if (event.keyCode == 38) {
          currentBoxNumber = textboxes.index(this);
        if (textboxes[currentBoxNumber - 1] != null) {
            prevBox = textboxes[currentBoxNumber - 1]
            prevBox.focus();
            prevBox.select();
            event.preventDefault();
            return false;
        }
    }
}
</script>

Answer 1

将if (event.keyCode == 13 || 40) {...更改为if (event.keyCode == 13 || event.keyCode == 40) { ...

Answer 2

这个博客会对你有所帮助。

演示页面

http://jqdev.blogspot.in/2012/01/traverse-cursor-through-text-box-with.html