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

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

— 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