开发者

Navigating through text input fields using arrow keys and return

开发者 https://www.devze.com 2023-03-13 18:48 出处:网络
I\'m trying to build a simple navigation mechanism between multiple input fields using jQuery. The first part of the code, skipping down by using the down arrow or return key work fine, but when I add

I'm trying to build a simple navigation mechanism between multiple input fields using jQuery. The first part of the code, skipping down by using the down arrow or return key work fine, but when I added the second block to go backwards by looking for the up arr开发者_运维问答ow and then reversing the order, typing in the first text field jumps right away to the second. Any thoughts?

<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>


change if (event.keyCode == 13 || 40) {... to if (event.keyCode == 13 || event.keyCode == 40) { ...

0

精彩评论

暂无评论...
验证码 换一张
取 消