PauloRB.dev

Desenvolvedor de Software

Função para fazer a tecla ENTER funcionar como a tecla TAB em formulários web. | PauloRB.dev Função para fazer a tecla ENTER funcionar como a tecla TAB em formulários web. – PauloRB.dev
Função para fazer a tecla ENTER funcionar como a tecla TAB em formulários web.

Função para fazer a tecla ENTER funcionar como a tecla TAB em formulários web.

Segue função em Jquery que utilizei muito em projetos para permitir o comportamento da tecla TAB(pular campos do formulários) utilizando a tecla enter, essa prática é muito comum em sistemas DESKTOP e acho interessante a sua implementação interessante em aplicações para a Internet tb. Abaixo segue o código:

$(document).ready(function() {
    jQuery('body').on('keydown', 'input, select, textarea', function(e) {
        var self = $(this)
                , form = self.parents('form:eq(0)')
                , focusable
                , next
                ;
        if (e.keyCode == 13) {
            focusable = form.find('input,select,button,textarea').filter(':visible');
            next = focusable.eq(focusable.index(this) + 1);
            if (next.length) {
                next.focus();
            } else {
                form.submit();
            }
            return false;
        }
    });
});

Mais Posts

Extensões Visual Studio Code para o dia a dia

Extensões Visual Studio Code para o dia a dia

Segue uma lista das extensões que mais utilizo em meu dia a dia como desenvolvedor quando uso o editor VisualStudio... Leia mais

Converter campos de um banco de dados do tipo json para array com laravel

Converter campos de um banco de dados do tipo json para array com laravel

Hoje boa parte dos banco de dados relacionais podem armazenar campos com valores no formato JSON o que garante maior... Leia mais

Como Usar Between Entre Duas Colunas de Data no Laravel

Como Usar Between Entre Duas Colunas de Data no Laravel

Trabalhar com intervalos de datas é uma necessidade comum em aplicações web, especialmente em sistemas que lidam com eventos, agendamentos... Leia mais

Como Resolver Problemas de Permissões ao Usar Docker no WSL2

Como Resolver Problemas de Permissões ao Usar Docker no WSL2

O Docker é uma ferramenta poderosa para gerenciar contêineres, e sua integração com o WSL2 no Windows oferece um ambiente... Leia mais