Como fazer algo antes de enviar? [fechadas]

141

Eu tenho um formulário que tem um botão que envia o formulário. Preciso fazer algo antes que os envios aconteçam. Tentei fazer onClick nesse botão, mas isso acontece após o envio.

Não posso compartilhar o código, mas, geralmente, o que devo fazer no jQuery ou no JS para lidar com isso?

javascript jquery html Jimmy
fonte
11
tosse Exemplo jsFiddle tosse
Brad Christie
2
@ Brad Christie, se eu pudesse aceitar o comentário como resposta. Muito obrigado.
Jimmy
3
Eu odeio quando o empilhamento fecha uma pergunta. Pode lidar com as suas acções através dos seguintes eventos que incêndio no seguinte tempo pouco antes de submeter uma forma: 1- onMouseover 2- onmousemove 3- onmousedown 4- onfocus 5- onmouseup 6- onclick 7- onsubmit
Shadi Namrouti
1
Agradeço esta pergunta porque tive o mesmo problema recentemente e essa é exatamente o que eu queria perguntar.
wastetime909
2
engraçado que essa pergunta tenha sido encerrada porque não é uma pergunta real: -?
AnnaKlein

Respostas:

207

Se você tiver um formulário como tal:

<form id="myform">
...
</form>

Você pode usar o seguinte código jQuery para fazer alguma coisa antes do envio do formulário:

$('#myform').submit(function() {
    // DO STUFF...
    return true; // return false to cancel form action
});
Dan Breen
fonte
2
Estou tendo problemas ao usá-lo para loops que precisam ser concluídos antes do envio. Alguma sugestão?
Smilyan
Tem algum código para analisar? Não tenho certeza se entendi o problema.
precisa
3
Por que isso está envolvido em uma chamada de função vazia? A submitfunção não deveria ser capaz de vincular diretamente a função $('#form')sem a função vazia ao redor? EDIT: os documentos sugerem que a chamada de função ao redor não é necessária .
eykanal
@eykanal Bom ponto. Fui em frente e editei a resposta para remover o invólucro da função depois de confirmar que ele funciona bem com a remoção.
Jon Schneider
3
@eykanal Eu usei a chamada de função "vazia", ​​porque é uma abreviação da $(document).ready()função do jQuery , que garante que o DOM esteja completo antes de anexar o submitevento. Se o seu JS estiver na parte inferior da página, não é necessário, mas se estiver na <head>seção, você precisará dele. Veja: stackoverflow.com/q/13062246/135108
Dan Breen
23

Supondo que você tenha um formulário como este:

<form id="myForm" action="foo.php" method="post">
   <input type="text" value="" />
   <input type="submit" value="submit form" />

</form>

Você pode anexar um onsubmit-event com jQuery assim:

$('#myForm').submit(function() {
  alert('Handler for .submit() called.');
  return false;
});

Se vocês return false o formulário não for enviado após a função, se você retornar verdadeiro ou nada, ele será enviado normalmente.

Veja a documentação do jQuery para mais informações.

acme
fonte
11

Você pode usar onclickpara executar algum código JavaScript ou jQuery antes de enviar o formulário da seguinte maneira:

<script type="text/javascript">
    beforeSubmit = function(){
        if (1 == 1){
            //your before submit logic
        }        
        $("#formid").submit();            
    }
</script>
<input type="button" value="Click" onclick="beforeSubmit();" />
James Johnson
fonte
18
Mas isso não funciona, quando o formulário contém, por exemplo, um campo de entrada e o usuário está pressionando a tecla de retorno que está disparando o evento de envio. Geralmente, é melhor anexar diretamente ao evento de envio para garantir que ele seja chamado independentemente de como o usuário acionou o envio.
Acme
2
<input type = "submit" value = "Clique" onmouseover = "beforeSubmit ();" />
Ansyori
5

verifique se o botão enviar não é do tipo "enviar", torne-o um botão. Em seguida, use o evento onclick para acionar algum javascript. Lá, você pode fazer o que quiser antes de realmente publicar seus dados.

rogerlsmith
fonte
3
O formulário pode ser enviado de várias maneiras, como pressionar Enter em determinados campos. Vincular a um clique em um botão que pode não ser clicado não é uma boa ideia. As outras respostas mostram como você vincula onsubmito formulário , que será acionado, não importa como o formulário seja enviado.
Jason