Impedindo o Envio de Formulário em JavaScript
Se necessário, você pode impedir o envio de
um formulário. Isso é feito através do já conhecido
preventDefault.
Vamos ver um exemplo.
Suponha que temos o seguinte formulário:
<form action="/handler/" method="POST">
<input name="test1">
<input name="test2">
<input type="submit">
</form>
Vamos obter uma referência para ele em uma variável:
let form = document.querySelector('form');
O envio do formulário pode ser capturado através do evento
submit:
form.addEventListener('submit', function() {
});
Agora vamos impedir o envio do formulário:
form.addEventListener('submit', function(event) {
event.preventDefault();
});
Dado um formulário com um input. Ao tentar enviá-lo, verifique se um email válido foi inserido no input. Caso contrário - impeça o envio do formulário e exiba uma mensagem sobre isso.