HTML 5模板中使用的PHP联系人表单,但不发送电子邮件

问题描述:

我有一个contact-form.php和一个index.html文件,如下所示.但是,当单击提交"以发送电子邮件时,它将重新加载页面,但没有任何反应,再次刷新了网站的主页.我的问题在哪里?

I have a contact-form.php and one index.html file as follows. but when click on submit to send email it reload the page and nothing happened, again the home page of site is refreshed. where is my problem?

我看到很多SO链接,但找不到问题.我在这里附上代码.所有这两个文件都在PHP服务器上的同一文件夹中.

I see lots of SO links but I couldn't find the problem. I attached here the codes. all of these two files are in the same folder on PHP Server.

<!-- CONTACT FORM -->
                                <div class="">
                                    <form id="contact-form" action="contact-form.php" method="POST">

                                        <div class="row">
                                            <div class="col-md-12 mb-30">
                                                <!-- <label>Your name *</label> -->
                                                <input type="text" value="" data-msg-required="Please enter your name"
                                                    maxlength="100" class="controled" name="name" id="name"
                                                    placeholder="NAME" required>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-md-12 mb-30">
                                                <!-- <label>Your email address *</label> -->
                                                <input type="email" value=""
                                                    data-msg-required="Please enter your email address"
                                                    data-msg-email="Please enter a valid email address" maxlength="100"
                                                    class="controled" name="email" id="email" placeholder="EMAIL"
                                                    required>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-md-12 mb-40">
                                                <!-- <label>Message *</label> -->
                                                <textarea maxlength="5000" data-msg-required="Please enter your message"
                                                    rows="3" class="controled" name="message" id="message"
                                                    placeholder="MESSAGE" required></textarea>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class="col-md-12 text-center-xxs">
                                                <input type="submit" value="SEND MESSAGE" class="button medium gray"
                                                    data-loading-text="Loading...">
                                            </div>
                                        </div>

                                    </form>
                                    <div class="alert alert-success hidden animated fadeIn" id="contactSuccess">
                                        <strong>Success!</strong> Your message has been sent to us.
                                    </div>

                                    <div class="alert alert-danger hidden animated shake" id="contactError">
                                        <strong>Error!</strong> There was an error sending your message.
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>

                </div>

<?php 
if(isset($_POST['submit'])){
    $to = "bbbbb@gmail.com"; 
    $from = $_POST['email']; 
    $first_name = $_POST['name'];
    $subject = "Form submission";
    $message = $first_name . " " . " wrote the following:" . "\n\n" .             $_POST['message'];


    $headers = "From:" . $from;

   $mail_status= mail($to,$subject,$message,$headers);


    }

if ($mail_status) { ?>
    <script language="javascript" type="text/javascript">
        window.location.href = 'index.html#contactSuccess';
    </script>
<?php
}
else { ?>
    <script language="javascript" type="text/javascript">
                window.location.href = 'index.html#contactSuccess';
    </script>
<?php
}
?>

在HTML提交按钮上放置一个名称:

Put a name on your HTML submit button:

<input type="submit" name="submit" value="SEND MESSAGE" class="button medium gray"
                                                        data-loading-text="Loading...">

  1. 首先,将最终的if放入$_POST['submit'] if中.您只能在提交时进行操作,并且$mail_status只能在其内部进行设置:

  1. Firstly, put your final if inside the $_POST['submit'] if. You only ever do that on submission, and $mail_status is only ever set inside it:

使用$_GET参数,而不是# ...这些参数用于滚动到名称相同的锚点.

Use $_GET params, rather than# ... those are use to scroll to an anchor that is named the same.

将index.html转换为index.php,以便您可以控制使用PHP显示的DIV.

Convert index.html to index.php so you can control what DIV to display using PHP.

$result = $_GET['result']将在带有?result=

那么

if($result == 'success') { 
?> <!-- Show Success Div --> <?php 
} else { 
?><!-- Show error DIV --> <?php

这是您的PHP,其中更改了重定向URL,以使用$_GET参数并将index.html转换为PHP:

Here's your PHP with the changes to the redirect URL to use $_GET params and index.html convert to PHP:

<?php
if (isset($_POST['submit'])) {
    $to         = "bbbbb@gmail.com";
    $from       = $_POST['email'];
    $first_name = $_POST['name'];
    $subject    = "Form submission";
    $message    = $first_name . " " . " wrote the following:" . "\n\n" . $_POST['message'];


    $headers = "From:" . $from;

    $mail_status = mail($to, $subject, $message, $headers);
    if ($mail_status) {
?>
   <script language="javascript" type="text/javascript">
        window.location.href = 'index.php?result=success';
    </script>
<?php
    } else {
?>
   <script language="javascript" type="text/javascript">
                window.location.href = 'index.php?result=failed';
    </script>
<?php
    }

}
?>