jQuery ci permette di controllare esattamente la posizione nel DOM degli elementi e di associare loro delle azioni in base a tale posizione. In questo articolo vedremo come impostare automaticamente il focus su un elemento di un form che segue l'elemento di partenza.
Il seguente plugin opera la sua selezione su tutti gli elementi di un form che possono ricevere il focus, a prescindere dalla loro posizione nel DOM:
(function($) {
$.fn.focusNextInputField = function() {
return this.each(function() {
var fields = $(this).parents('form:eq(0),body').find('button,input,textarea,select');
var index = fields.index(this);
if (index > -1 && (index + 1) < fields.length) {
fields.eq(index + 1).focus();
}
return false;
});
};
})(jQuery);
Esempio d'uso:
$('#name', '#test').focusNextInputField();