这是我的表单(HTML):
<form id="contact_form" name="contact_form" method="post" action="<?php echo htmlentities($_SERVER['SCRIPT_NAME']); ?>">
<input type="text" placeholder="Nome e cognome" name="nome" id="nome" style="width:290px">
<br>
<br>
<input type="text" placeholder="Azienda" name="azienda" id="azienda" style="width:290px">
<br>
<br>
<input type="text" placeholder="Città" name="citta" id="citta" style="width:290px">
<br>
<br>
<input type="text" placeholder="Recapito telefonico" name="telefono" id="telefono" style="width:290px">
<br>
<br>
<input type="text" placeholder="Email" name="email" id="email" style="width:290px">
<br>
<br>
<input type="text" placeholder="Tipo di evento" name="tipodievento" id="tipodievento" style="width:290px">
<br>
<br>
<input type="text" placeholder="Numero di invitati stimato" name="invitati" id="invitati" style="width:290px">
<br>
<br>
<textarea placeholder="Descrizione" style="max-width:600px;max-height:400px;width:290px;height:200px" name="messaggio" id="messaggio">
</textarea>
<br>
<br>
<div id="boingdiv" style="width:300px;position:relative;">
<input type="checkbox" name="checkbox" id="checkbox" />
<small> Ho preso visione dell'<a style="color:#b40734" href="images/contatti/informativa.pdf" target="_blank">informativa</a></small>
</div>
<br>
<br>
<input id="submit_it" name="submit_it" type="button" value="Invia">
</form>
这是我的JS(jQuery)函数,用于检查是否填充了输入并选中了复选框(唯一的输入不是强制性的是“azienda”):
arrValidate = ['nome','citta','telefono','email','tipodievento','invitati','messaggio']
$(document).ready(function() {
$('#submit_it').click(function() {
var nextFld, i ;
//Validate the checkbox:
if ( $('#checkbox').is(':checked') == false ) {
alert('You must read the informativa and check the checkbox at bottom of form');
boing();
return false;
}
//Validate the rest of the fields
for (i=0; i<arrValidate.length; i++){
nextFld = arrValidate[i];
if ( $.trim($('#'+nextFld).val()) == '') {
alert('Please complete all fields. You missed the [' +nextFld+ '] field.');
$('#'+nextFld).css({'border':'1px solid red','background':'yellow'});
$('#'+nextFld).focus();
return false;
}
}
//if it gets here, all is okay: submit!
$('form#contact_form').submit();
}); //END submit button click event
//Remove any css validation coloring
$('input:not([type=button])').blur(function(){
$(this).css({'border':'1px solid lightgrey','background':'white'});
});
//Remove any background coloring from checkbox div
$('#checkbox').click(function() {
$('#boingdiv').css({'background':'white'});
});
//Remove existing value/text upon entry into field
$('input:not([type=button]').focus(function() {
$(this).val('');
});
}); //END document.ready
function boing(){
$('#boingdiv')
.css({'background':'wheat'})
.animate({ left: "-10px" }, 100).animate({ left: "10px" }, 100)
.animate({ left: "-10px" }, 100).animate({ left: "10px" }, 100)
.animate({ left: "0px" }, 100)
.focus();
}
最后这是应该发送邮件的PHP脚本:
<?php
$your_email ='MY EMAIL ADDRESS';
if(isset($_POST['submit_it']))
{
$nome = $_POST['nome'];
$email = $_POST['email'];
$citta = $_POST['citta'];
$telefono = $_POST['telefono'];
$tipodievento = $_POST['tipodievento'];
$invitati = $_POST['invitati'];
$azienda = $_POST['azienda'];
$messaggio = $_POST['messaggio'];
$to = $your_email;
$subject="Nuova mail dal form per i contatti";
$from = $your_email;
$body = "$nome ha inviato un messaggio tramite il contact form:\n".
"Nome: $nome\n".
"Citta: $citta\n".
"Evento: $tipodievento\n".
"Azienda: $azienda\n".
"Numero di invitati: $invitati\n".
"Telefono: $telefono\n".
"Email: $email \n".
"Messaggio: \n".
"$messaggio\n";
$headers = "From: $from \r\n";
$headers .= "Reply-To: $email \r\n";
mail($to, $subject, $body, $headers);
}
?>
字段验证(jQuery)工作正常。如果未填写所有字段,则无法单击“提交”按钮。问题在于“后端”部分。邮件未发送。电子邮件服务器没有问题。我尝试了其他形式,它的工作原理..在最后一段代码中应该有一些错误。因为我在共享主机上,所以无法看到日志。