Tab behavior using jQuery

2019-03-06 03:20发布

I have a some text boxes in my form. I don't know their id values. I want change the cursor position from the existing one to the next field by pressing Enter.
Pay attention that the cursor may be in different positions at the first time.

What is your suggestion?

1条回答
等我变得足够好
2楼-- · 2019-03-06 03:41

you didn't provide your markup so I can't make assumption about your structure (e.g. using .next() if they are sibling elements). So, supposing you have input text, try this example (for jQuery 1.7+)

$(document).ready(function() {

    var inputs = $('input[type="text"]');
    var len = inputs.length;

    inputs.on('keyup', function(evt) {
        if (evt.keyCode === 13) {
           var currentInput = inputs.index($(this));
           inputs.eq((currentInput < len - 1)
                     ? currentInput + 1
                     : 0).focus();

           evt.preventDefault();
        }
    });
});

When you press enter on last input, the first input will be focused (in a loop). See a jsfiddle example: http://jsfiddle.net/8ruDV/

查看更多
登录 后发表回答