我从https://themewagon.com下载了此网站模板,无法使联系表单生效。我更改了.php文件中的信息以获取我的个人信息,但每次我尝试发送消息时都没有发生任何事情,除了正在刷新的页面。 *(我必须翻译一些单词,以便它们在我的网站上以法语显示)
Index.html中的Jquery
<script type="text/javascript">
$(document).ready(function(){
inicializemap()
$('#contactForm').on('envoyer', function(e){
e.preventDefault();
e.stopPropagation();
// get values from FORM
var name = $("#name").val();
var email = $("#email").val();
var message = $("#message").val();
var goodToGo = false;
var messgaeError = 'Request can not be send';
var pattern = new RegExp(/^(('[\w-\s]+')|([\w-]+(?:\.[\w-]+)*)|('[\w-\s]+')([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
if (name && name.length > 0 && $.trim(name) !='' && message && message.length > 0 && $.trim(message) !='' && email && email.length > 0 && $.trim(email) !='') {
if (pattern.test(email)) {
goodToGo = true;
} else {
messgaeError = 'Revérifiez votre adresse courriel.';
goodToGo = false;
}
} else {
messgaeError = 'Vous devez remplir tout les champs pour envoyer votre message.';
goodToGo = false;
}
if (goodToGo) {
$.ajax({
data: $('#contactForm').serialize(),
beforeSend: function() {
$('#success').html('<div class="col-md-12 text-center"><img src="images/spinner1.gif" alt="spinner" /></div>');
},
success:function(response){
if (response==1) {
$('#success').html('<div class="col-md-12 text-center">Your email was sent successfully</div>');
window.location.reload();
} else {
$('#success').html('<div class="col-md-12 text-center">E-mail was not sent. Please try again!</div>');
}
},
error:function(e){
$('#success').html('<div class="col-md-12 text-center">We could not fetch the data from the server. Please try again!</div>');
},
complete: function(done){
console.log('Finished');
},
type: 'POST',
url: 'js/send_email.php',
});
return true;
} else {
$('#success').html('<div class="col-md-12 text-center">'+messgaeError+'</div>');
return false;
}
return false;
});
});
</script>
HTML @ Index.html中的联系表单
<section id="contact">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="col-lg-12">
<div class="text-center color-elements">
<h2>Nous joindre</h2>
</div>
</div>
<div class="col-lg-6 col-md-8">
<form class="inline" id="contactForm" method="post" >
<div class="row">
<div class="col-sm-6 height-contact-element">
<div class="form-group">
<input type="text" name="first_name" class="form-control custom-labels" id="name" placeholder="Votre nom" required data-validation-required-message="Veuillez écrire votre nom"/>
<p class="help-block text-danger"></p>
</div>
</div>
<div class="col-sm-6 height-contact-element">
<div class="form-group">
<input type="email" name="email" class="form-control custom-labels" id="email" placeholder="Votre courriel" required data-validation-required-message="Veuillez écrire votre courriel"/>
<p class="help-block text-danger"></p>
</div>
</div>
<div class="col-sm-12 height-contact-element">
<div class="form-group">
<input type="text" name="message" class="form-control custom-labels" id="message" placeholder="Votre message" required data-validation-required-message="Veuillez écrire un message"/>
</div>
</div>
<div class="col-sm-3 col-xs-6 height-contact-element">
<div class="form-group">
<input type="submit" class="btn btn-md btn-custom btn-noborder-radius" value="Envoyer"/>
</div>
</div>
<div class="col-sm-3 col-xs-6 height-contact-element">
<div class="form-group">
<button type="button" class="btn btn-md btn-noborder-radius btn-custom" name="reset">Réinitialiser
</button>
</div>
</div>
<div class="col-sm-3 col-xs-6 height-contact-element">
<div class="form-group">
<div id="response_holder"></div>
</div>
</div>
<div class="col-sm-12 contact-msg">
<div id="success"></div>
</div>
</div>
</form>
</div>
<div class="col-lg-5 col-md-3 col-lg-offset-1 col-md-offset-1">
<div class="row">
<div class="col-md-13 height-contact-element">
<div class="form-group">
<i class="fa fa-2x fa-map-marker"></i>
<span class="text">(Bureau) 2370 Rue des Groseilliers, St-Étienne-de-Lauzon (Qc)</span>
</div>
</div>
<div class="col-md-13 height-contact-element">
<div class="form-group">
<i class="fa fa-2x fa-phone"></i>
<span class="text">418-930-8214</span>
</div>
</div>
<div class="col-md-13 height-contact-element">
<div class="form-group">
<i class="fa fa-2x fa-envelope"></i>
<span class="text">maisonhanteedestetienne@hotmail.com</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
send_email.php
<?php
if (isset($_REQUEST['email'])) {
//Email information
$admin_email = "maisonhanteedestetienne@hotmail.com";
$name = $_REQUEST['first_name'];
$email = $_REQUEST['email'];
$message = $_REQUEST['message'];
//send email
if (mail($admin_email, $name, $message, "From:" . $email)) {
echo 1;
}
else {
echo 0;
}
}
?>