php联系表单在移动设备上工作但不在桌面上

时间:2016-12-05 04:40:52

标签: php ajax forms contact-form

我的网站上的PHP联系表单不能在桌面上工作,但在移动设备上完美正常工作...... ajax联系表单必须发送邮件并淡出div并显示谢谢消息....

访问http://www.mount-edge.com

我不是一个专业的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>

0 个答案:

没有答案