我的网站上的PHP联系表单不能在桌面上工作,但在移动设备上完美正常工作...... ajax联系表单必须发送邮件并淡出div并显示谢谢消息....
我不是一个专业的PHP,我自己做了网站...任何人都可以帮我解决这个问题。
AJAX.php
//form submission//
$(function() {
var theForm = $("#memberform");
theForm.validate({
submitHandler: function(theForm) {
$('#loader', theForm).html('Please Wait...');
$.ajax({
type: "POST",
url: "handler.php",
data: $(theForm).serialize(),
timeout: 20000,
success: function(msg) { $(theForm).fadeOut((500, function(){
$(theForm).html("<h2>Thank you. We will contact you shortly.</h2>").fadeIn();
}));
},
error: $('.thanks').show()
});
return false;
}
});
});
HANDLER.PHP
<?php
$to = 'example@gmail.com';
$subject = 'Contact Form';
$name = $_POST['senderName'];
$phone = $_POST['senderNumber'];
$email = $_POST['senderEmail'];
$message = $_POST['senderComments'];
$MESSAGE_BODY = "Name: ".$name."<br>";
$MESSAGE_BODY .= "Contact No: ".$phone."<br>";
$MESSAGE_BODY .= "Email: ".$email."<br>";
$MESSAGE_BODY .= "Message: ".nl2br($message)."<br>";
$headers = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
// Additional headers
$headers .= 'From: Mount-Edge' . "\r\n";
$headers .= 'Reply-To: example@gmail.com' . "\r\n";
$headers .= 'Cc: example@gmail.com' . "\r\n";
//$headers .= 'Bcc: example@example.com' . "\r\n";
mail($to, $subject, $MESSAGE_BODY, $headers);
?>
的index.php
<form title="contact form" id="memberform" action="handler.php" method="POST">
<div class="container" style="padding:50px;">
<div class="row" style="text-align: center;padding:0 0 30px 0;">
<h1>Need a website for your business ?</h1>
<p>Send us a message and we'll get back to you.</p>
</div>
<div class="row">
<div class="col-sm-6">
<label for="senderName">Name<span> * </span> </label><br/>
<input class="form-control" id="senderName" type="text" name="senderName" required="required"/>
</div>
<div class="col-sm-6">
<label for="senderNumber">Phone<span> * </span> </label><br/>
<input class="form-control" id="senderNumber" type="number" name="senderNumber" maxlength="15" minlength="10" required="required"/>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<label for="senderEmail">Email<span> * </span></label><br/>
<input class="form-control" id="senderEmail" type="email" name="senderEmail" required="required"/>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<label for="senderComments">Your Message</label><br/>
<textarea class="form-control" id="senderComments" name="senderComments" rows="7"></textarea>
</div>
</div>
<div class="row" style="text-align: center;padding-top:30px;">
<input class="submit-btn" id="submit" type="submit" value="submit"/>
<div id="loader"></div>
</div>
</div>
</form>
页面顶部的脚本
<script
src="https://code.jquery.com/jquery-3.1.1.min.js"
integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdn.ywxi.net/js/1.js"></script>
<script src="js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/met.js"></script>
<script type="text/javascript" src="ajax.js" ></script>