Question

我正在进行JavaScript和PHP表单验证，我已经完成了所有工作，但由于某些原因，我的PHP和JavaScript不能一起工作。如果我注释掉我的JavaScript，那么我的PHP文件将起作用，但否则我的表单不会获取我的PHP文件。

我已尝试在<div>中执行表单操作以及PHP包含。也没有用。

function validateContactForm()
{

    var error = "<strong>There were error(s) in your form:</strong>";
    var errorMsg = new Array();


    var name = document.ContactForm.name;
    var email = document.ContactForm.email;
    var message = document.ContactForm.message; 
    var subject = document.ContactForm.subject;

    if (name.value == "")
    {       
        errorMsg.push("<br />Please enter your name");
    }
    if (email.value == "")
    {
        errorMsg.push("<br />Please enter your email.");

    }
    if (subject.value == "")
    {
        errorMsg.push("<br />Please enter a subject.");

    }
    if (message.value == "")
    {
        errorMsg.push("<br />Please enter a message.");
    }

    var messageHtml="";

    errorMsg.forEach(function(comment) {
        messageHtml += comment;
    }); 

    if(messageHtml.length > 0){
        $("#error").show();
        document.getElementById("error").innerHTML = error + messageHtml;
        return false;
    } else {
        $("#error").hide();
        $("#success").show();
        document.getElementById("success").innerHTML = "<strong>Thank you!</strong> I'll be in touch.";
        document.getElementById("validationForm").reset();
        return false;
    }

    return true;
}

HTML：

<div class="container" style="margin-top:50px">

    <div class='row whiteBackground'>
        <h1>Contact Form</h1>
        <?php echo $result; ?>
        <div id="error" class='alert alert-danger'> </div>
        <div id="success" class="alert alert-success"></div>
        <form name="ContactForm" action="email.php" method="post" class="form-horizontal" id="validationForm" onsubmit="return validateContactForm();">

            <div class="form-group name">
                <label for="name" class="col-sm-2 control-label">Name</label>
                <div class="col-sm-10">
                    <input type="text" name="name" id="name" class="form-control" placeholder="Your Name" />
                </div>
            </div>
            <div class="form-group email">
                <label for="email" class="col-sm-2 control-label">Email</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" name="email" placeholder="Your Email" />
                </div>
            </div>
            <div class="form-group subject">
                <label for="subject" class="col-sm-2 control-label">Subject</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" name="subject" placeholder="Subject Message" />
                </div>
            </div>
            <div class="form-group message">
                <label for="message" class="col-sm-2 control-label">Message</label>
                <div class="col-sm-10">
                    <textarea class="form-control" name="message" placeholder="Your message..."></textarea>
                </div>
            </div>
            <div class="g-recaptcha col-sm-offset-2" data-sitekey="6LehmgETAAAAAKSi_P8IFa9f7sqS5XXW0UK7PQDv"></div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <input type="submit" name="submit" class="btn btn-success btn-lg" value="Send Message" />

                </div>
            </div>

        </form>
    </div>
    <script>
        $("#error").hide();
    </script>
    <script>
        $("#success").hide();
    </script>
</div>

Answer 1

您的函数始终返回false。像这样更新：

if(messageHtml.length > 0){
    $("#error").show();
    document.getElementById("error").innerHTML = error + messageHtml;
    return false;
} else {
    $("#error").hide();
    $("#success").show();
    document.getElementById("success").innerHTML = "<strong>Thank you!</strong> I'll be in touch.";
    document.getElementById("validationForm").reset();
    return true;
}

PHP表单操作无效

1 个答案: