JQUERY Simulating Press the TAB key after User clicks on a DIV

Question

When I click on a DIV I need to press the TAB key (in order to go from one input field to the next one).

I tried this code but is not working:

$("#change_logo").click(function() { e = jQuery.Event("keydown"); e.which = 9; // This is the ID of the input where I want to simulate the "Press TAB Key" // and then I will go automatically to the following input which ID is // #newsletter_section_title2 $("#newsletter_section_title1").trigger(e); });

I know there are so many different ways to do this, .focus(), etc. How ever, for another reasons I need to do it simulating a TAB key pressed (but the user don't press TAB, the user only click on a div).

Anyone knows how to do it?

Many thanks, Dani

Nick Craver · Accepted Answer · 2010-08-08 12:03:34Z

Simulating a tab press won't do the job here, it's not that you're doing anything incorrect, it's that simulating an event doesn't often invoke the default action, in this case focusing the next field. For example .click() on a <a> won't follow the link either.

You need to go the .focus() route, $('#newsletter_section_title2').focus(), to get the effect you want here...what are your reasons for avoiding it to begin with?

Mark Lagendijk · Accepted Answer · 2013-09-11 12:25:53Z

I created a simple jQuery plugin which does solve this problem. It uses the ':tabbable' selector of jQuery UI to find the next 'tabbable' element and selects it.

Example usage:

$("#change_logo").click(function() { $.focusNext(); });

Collectives™ on Stack Overflow

JQUERY Simulating Press the TAB key after User clicks on a DIV

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related