Baixei os códigos de uma página no https://html5up.net/ para utilizar como uma página temporária enquanto o site de um evento que organizo não fica pronto. A página possui apenas um campo onde a pessoa coloca o e-mail e clica em enviar.
Preciso que quando ela clique no botão Enviar, o e-mail que ela digitou seja enviado para mim via e-mail para que eu possa cadastra-lo.
No head
do HTML há uma linha lincando o index.html à página com o JS (linha abaixo):
head do index.html
<link rel="stylesheet" href="assets/css/main.css" />
index.html
<!-- Signup Form -->
<form id="signup-form" method="post" action="#">
<input type="email" name="email" id="email" placeholder="E-mail" />
<input type="submit" value="Enviar" />
</form>
main.js
// Signup Form.
(function() {
// Vars.
var $form = document.querySelectorAll('#signup-form')[0],
$submit = document.querySelectorAll('#signup-form input[type="submit"]')[0],
$message;
// Bail if addEventListener isn't supported.
if (!('addEventListener' in $form))
return;
// Message.
$message = document.createElement('span');
$message.classList.add('message');
$form.appendChild($message);
$message._show = function(type, text) {
$message.innerHTML = text;
$message.classList.add(type);
$message.classList.add('visible');
window.setTimeout(function() {
$message._hide();
}, 3000);
};
$message._hide = function() {
$message.classList.remove('visible');
};
// Events.
// Note: If you're *not* using AJAX, get rid of this event listener.
$form.addEventListener('submit', function(event) {
event.stopPropagation();
event.preventDefault();
// Hide message.
$message._hide();
// Disable submit.
$submit.disabled = true;
// Process form.
// Note: Doesn't actually do anything yet (other than report back with a "thank you"),
// but there's enough here to piece together a working AJAX submission call that does.
window.setTimeout(function() {
// Reset form.
$form.reset();
// Enable submit.
$submit.disabled = false;
// Show message.
$message._show('success', 'Obrigado! Nos vemos em breve ; )');
//$message._show('failure', 'Something went wrong. Please try again.');
}, 750);
});
})();