How can I automatically tab to the next field using jQuery?

Question

In jQuery, how can I trigger the behavior of a user tabbing to the next input field?

I\'ve tried this:

var e = jQuery.Event(\"keydown\");
e.which = 9         


        

Answer 1

Here's one solution, via http://jqueryminute.com/set-focus-to-the-next-input-field-with-jquery/

$.fn.focusNextInputField = function() {
    return this.each(function() {
        var fields = $(this).parents('form:eq(0),body').find(':input').not('[type=hidden]');
        var index = fields.index( this );
        if ( index > -1 && ( index + 1 ) < fields.length ) {
            fields.eq( index + 1 ).focus();
        }
        return false;
    });
};

The use is as follows:

$( 'current_field_selector' ).focusNextInputField();

Answer 2

See the accepted answer to this question. If for example you want to move focus to the next field when a certain number of characters have been entered, you could use that code in the keyup event, and check the entered number of characters.

The code in that answer works by getting the set of inputs in the form, finding the selected input and adding 1 to the index of the selected input, and then triggering the focus event on the element with that index.

Answer 3

Have you tried using

$("input").trigger( 'keypress', e );

as a solution?
I find sometimes being explicit is best. If that doesn't work possibly even

$("input").trigger( 'keypress', [{preventDefault:function(){},keyCode:9}] );.

Hope this helps.

Answer 4

There's a JQuery plugin available:

http://www.mathachew.com/sandbox/jquery-autotab/