1

我有一个联系表单,用户在其中输入他的姓名、职务、消息等,并使用名为screen.js的 javascript 文件进行验证。这是我在 html 视图中的联系表单中的代码。

<div class="contact_us">
    <form id="contactform" action="#" method="post">
        <div class="formpart">
            <label for="contact_name">Name</label>
            <p><input type="text" name="name" id="contact_name" value="" class="requiredfield"/></p>
        </div>  
        <div class="formpart formpart1">
            <label for="contact_designation">Designation</label>
            <p><input type="text" name="designation" id="contact_designation" value=""/></p>
        </div>  
        <div class="formpart">
            <label for="contact_companyname">Company Name</label>
            <p><input type="text" name="companyname" id="contact_companyname" value="" class="requiredfield"/></p>
        </div>  
        <div class="formpart formpart1">
            <label for="contact_email">Email Address</label>
            <p><input type="text" name="email" id="contact_email" value="" class="requiredfield"/></p>
        </div>  
        <div class="formpart">
            <label for="contact_phone">Contact No.</label>
            <p><input type="text" name="phone" id="contact_phone" value=""/></p>
        </div>
        <div class="formpart">
            <label for="contact_message">Message</label>
            <p><textarea name="message" id="contact_message" class="requiredfield"></textarea></p>
        </div>          
        <div class="formpart">
            <button type="submit" name="send" class="sendmessage">Send</button>
        </div>
        <div class="formpart">
            <span class="errormessage">Error! Please correct marked fields.</span>
            <span class="successmessage">Email send successfully!</span>
            <span class="sendingmessage">Sending...</span>
        </div>
    </form>
</div>

并且 javascript 文件screen.js包含

jQuery(document).ready(function() { 


    /* Contact Form */
    if(jQuery('#contactform').length != 0){
        addForm('#contactform');
    }

    /* Newsletter Subscription */
    if(jQuery('#newsletterform').length != 0){
        addForm('#newsletterform');
    }

});

/* Contact Form */
function addForm(formtype) {

    var formid = jQuery(formtype);
    var emailsend = false;

    formid.find("button[name=send]").click(sendemail);

    function validator() {

        var emailcheck = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
        var othercheck = /.{4}/;
        var noerror = true;

        formid.find(".requiredfield").each(function () {

            var fieldname = jQuery(this).attr('name');
            var value = jQuery(this).val();

            if(fieldname == "email"){
                if (!emailcheck.test(value)) {
                    jQuery(this).addClass("formerror");
                    noerror = false;
                } else {
                    jQuery(this).removeClass("formerror");
                }   
            }else{
                if (!othercheck.test(value)) {
                    jQuery(this).addClass("formerror");
                    noerror = false;
                } else {
                    jQuery(this).removeClass("formerror");
                }   
            }
        })

        if(!noerror){
            formid.find(".errormessage").fadeIn();
        }

        return noerror;
    }

    function resetform() {
        formid.find("input").each(function () {
            jQuery(this).val("");   
        })
        formid.find("textarea").val("");
        emailsend = false;
    }

    function sendemail() {
        formid.find(".successmessage").hide();
        var phpfile = "";
        if(formtype=="#contactform"){
            phpfile = "../php/contact.php";
        }else if(formtype=="#newsletterform"){
            phpfile = "php/signup.php";
        }else{
            phpfile = "";
        }
        if (validator()) {
            if(!emailsend){
                emailsend = true;
                formid.find(".errormessage").hide();
                formid.find(".sendingmessage").show();
                jQuery.post(phpfile, formid.serialize(), function() {
                    formid.find(".sendingmessage").hide();
                    formid.find(".successmessage").fadeIn();
                    resetform();
                });
            }
        } 
        return false
    }
}

和我的php文件contact.php

<?php

$to = "developer@vakilspremedia.com"; /* Enter your email adress here */

$name = trim($_POST['name']);
$designation = trim($_POST['designation']);
$companyname = trim($_POST['companyname']);
$email = trim($_POST['email']);
$phone = trim($_POST['phone']);
$message = str_replace(chr(10), "<br>", $_POST['message']);

$body = "<html><head><title>Contact Form Email</title></head><body><br>";
$body .= "Name: <b>" . $name . "</b><br>";
$body .= "Designation: <b>" . $designation . "</b><br>";
$body .= "Company Name: <b>" . $companyname . "</b><br>";
$body .= "Email: <b>" . $email . "</b><br>";
$body .= "Phone: <b>" . $phone . "</b><br><br>";
$body .= "Message:<br><hr><br><b>" . $message . "</b><br>";
$body .= "<br></body></html>";

$subject = 'Contact Form Email from ' . $name;
$header = "From: $to\n" . "MIME-Version: 1.0\n" . "Content-type: text/html; charset=utf-8\n";

mail($to, $subject, $body, $header);

?>

验证工作完美,但是当我在所有字段中输入值时,它显示正在发送...作为消息,并且即使经过数小时的等待,也不会显示电子邮件已成功发送。单击发送按钮后,它似乎什么也没做。

4

1 回答 1

1

修改此代码的 js 确保 phpfile var 具有 url 路径或将 contact.php 放在同一目录中

jQuery.post('contact.php', formid.serialize(), function() {

                console.log('success');
                formid.find(".sendingmessage").hide();
                formid.find(".successmessage").fadeIn();
                resetform();

});

于 2012-10-26T11:39:22.633 回答