Como usar o onSubmit no JavaScript

Escrito por ehow contributor | Traduzido por mariana de mello andré scarani
  • Compartilhar
  • Tweetar
  • Compartilhar
  • Pin
  • E-mail
Como usar o onSubmit no JavaScript
Você pode usar o evento onSubmit para automatizar tarefas (Jupiterimages/Photos.com/Getty Images)

O evento onSubmit do JavaScript é uma ótima forma de se automatizar tarefas. Com ele, você pode fazer o navegador validar as informações que foram enviadas através de um formulário antes que o servidor as receba. É possível ainda redirecionar o visitante para uma outra parte de seu site ou evitar que um formulário seja enviado mais de uma vez. O importante é saber como usá-lo.

Nível de dificuldade:
Moderado

Outras pessoas estão lendo

O que você precisa?

  • Editor JavaScript
  • Navegador web

Lista completaMinimizar

Instruções

    Use o onSubmit no JavaScript

  1. 1

    Entenda, primeiramente, que o evento onSubmit executa uma série de comandos (ou apenas um) no momento em que o visitante de um site clica no botão de envio de um formulário. Para que ele funcione, é preciso usar um formulário HTML que esteja programado corretamente e uma função que esteja definida em algum ponto anterior ao formulário.

  2. 2

    Crie uma função que execute os comandos quando o botão de envio do formulário for clicado. Para reduzir o seu trabalho e evitar potenciais erros, coloque esta função no cabeçalho do seu arquivo HTML. Por exemplo: function ComandosMeuFormulario() {alert('Um texto');} Neste exemplo, uma caixa de alerta com a mensagem "Um texto" será exibida assim que o visitante clicar no botão de envio do formulário, assumindo que este botão esteja codificado corretamente.

  3. 3

    Chame a função a partir da tag de formulário de sua página HTML. Por exemplo: <FORM onSubit="ComandosMeuFormulario()"><input type=submit></FORM>

  4. 4

    Estude o exemplo abaixo, que demonstra como criar um evento onSubmit no JavaScript. O exemplo executa a função "ComandosMeuFormulario()" assim que o botão de envio do formulário for clicado, e exibirá uma caixa de alerta com o texto "Um texto". function ComandosMeuFormulario() {alert('Um texto');}<FORM onSubmit="ComandosMeuFormulario()"><input type=submit></FORM>

  5. 5

    Copia e cole o código acima em suas páginas, se não quiser desenvolver o evento onSubmit desde o início. É possível substituir os valores do evento de acordo com sua vontade.

Dicas & Advertências

  • Se não testar o script em vários navegadores diferentes, seus usuários podem ter problemas de compatibilidade. Por exemplo, o Netscape e o IE muitas vezes não interpretam (executam) o script da mesma forma.

Não perca

Filtro:
  • Geral
  • Artigos
  • Slides
  • Vídeos
Mostrar:
  • Mais relevantes
  • Mais lidos
  • Mais recentes

Nenhum artigo disponível

Nenhum slide disponível

Nenhum vídeo disponível