logo标签列表

PHP表单失效

javascriptphphtml
3

我在使用一个PHP邮件表单时遇到了问题。这个表单是从我设计的另一个网站复制和粘贴来的（那个网站可以正常工作）- 我唯一做的不同之处就是稍微改变了文件结构来整理代码。

以前，所有主要的HTML页面都位于根目录中，而组件文件（JS，PHP，图像，字体等）位于“html”目录中 - 例如$root/contact us.html，组件位于$root/html/js/forms.js。

这一次，我只是删除了“html”目录，所以所有文件和文件夹都位于根目录中 - 例如$root/contact us.html，$root/js/forms.js。

我已经更新了PHP和JS文件，以便它们都指向正确的方向，但表单现在无法工作。

有人能发现我做错了什么吗？

以下是代码...

HTML

<form id="project-contact-form" action="javascript:void(0)" method="post">
  <div class="row">
    <div class="col-12">
      <div id="success-project-contact-form" class="vb-blue">Awesome - your message was sent! We'll be in touch soon.</div>
    </div>

    <div class="col-md-6">
      <input type="text" name="name" id="name" placeholder="Name *" class="big-input">
    </div>

    <div class="col-md-6">
      <input type="text" name="phone" id="phone" placeholder="Phone" class="big-input">
    </div>

    <div class="col-md-6">
      <input type="text" name="email" id="email" placeholder="E-mail *" class="big-input">
    </div>

    <div class="col-md-6">
      <div class="select-style big-select">
        <select name="subject" id="subject" class="big-input">
          <option value="">What's your message about?</option>
          <option value="general">- a general enquiry</option>
          <option value="product">- product related</option>
          <option value="delivery">- about a delivery</option>
          <option value="complaint">- a complaint</option>
          <option value="b2b">- a business proposal</option>
        </select>
      </div>
    </div>

    <div class="col-md-12">
      <textarea name="comment" id="comment" placeholder="Your message" rows="6" class="big-textarea"></textarea>
    </div>

    <div class="col-md-12 text-center">
      <button id="project-contact-us-button  margin-bottom-35" type="submit" class="btn btn-medium btn-rounded white bg-vb-red sbold-txt">SEND MESSAGE</button>
    </div>
  </div>
</form>

JS

"use strict";
    /*==============================================================
    form to email
    ==============================================================*/
    $("#success-project-contact-form").hide();
    //Project Contact us form
    $('#project-contact-us-button').on("click", function () {
        var error = ValidationProjectContactForm();
        if (error) {
            $.ajax({
                type: "POST",
                url: "php/project-contact-form.php",
                data: $("#project-contact-form").serialize(),
                success: function (result) {
                    // Un-comment below code to redirect user to thank you page.
                    //window.location.href="thank-you.html";

                    $('input[type=text],textarea').each(function () {
                        $(this).val('');
                    })
                    $("#success-project-contact-form").html(result);
                    $("#success-project-contact-form").fadeIn("slow");
                    $('#success-project-contact-form').delay(4000).fadeOut("slow");
                }
            });
        }
    });
    function ValidationProjectContactForm() {
        var error = true;
        $('#project-contact-form input[type=text]').each(function (index) {
            if (index == 0) {
                if ($(this).val() == null || $(this).val() == "") {
                    $("#project-contact-form").find("input:eq(" + index + ")").addClass("required-error");
                    error = false;
                } else {
                    $("#project-contact-form").find("input:eq(" + index + ")").removeClass("required-error");
                }
            } else if (index == 2) {
                if (!(/(.+)@(.+){2,}\.(.+){2,}/.test($(this).val()))) {
                    $("#project-contact-form").find("input:eq(" + index + ")").addClass("required-error");
                    error = false;
                } else {
                    $("#project-contact-form").find("input:eq(" + index + ")").removeClass("required-error");
                }
            }

        });
        return error;
    }

    /*==============================================================
    End form to email
    ==============================================================*/

以及 PHP

<?php
  if(isset($_POST['email'])) {
    $name =$_POST["name"];  
    $from =$_POST["email"]; 
    $phone=$_POST["phone"]; 
    $comment=$_POST["comment"]; 
    $subject=$_POST["subject"];

// Email Receiver Address
    $receiver="info@1230.co";
    $subject="Website Contact Form";
    $message = "
    <html>
    <head>
    <title>Website Contact Form</title>
    </head>
    <body>
    <table width='50%' border='0' align='center' cellpadding='0' cellspacing='0'>
    <tr>
    <td colspan='2' align='center' valign='top'><img style=' margin-top: 15px; ' src='img/logo-forms.png' ></td>
    </tr>
    <tr>
    <td width='50%' align='right'>&nbsp;</td>
    <td align='left'>&nbsp;</td>
    </tr>
    <tr>
    <td align='right' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 5px 7px 0;'>Name:</td>
    <td align='left' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 0 7px 5px;'>".$name."</td>
    </tr>
    <tr>
    <td align='right' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 5px 7px 0;'>Email:</td>
    <td align='left' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 0 7px 5px;'>".$from."</td>
    </tr>
    <tr>
    <td align='right' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 5px 7px 0;'>Phone:</td>
    <td align='left' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 0 7px 5px;'>".$phone."</td>
    </tr>
    <tr>
    <td align='right' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 5px 7px 0;'>Subject:</td>
    <td align='left' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 0 7px 5px;'>".$subject."</td>
    </tr>
    <tr>
    <td align='right' valign='top' style='border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 5px 7px 0;'>Message:</td>
    <td align='left' valign='top' style='border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 0 7px 5px;'>".nl2br($comment)."</td>
    </tr>
    </table>
    </body>
    </html>
    ";
// Always set content-type when sending HTML email
    $headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";

// More headers
$headers .= 'From: <'.$from.'>' . "\r\n";
   if(mail($receiver,$subject,$message,$headers))  
   {

//Success Message
      echo "The message has been sent!";
   }
    else
   {

//Fail Message
      echo "The message could not been sent!";
   }
}
?>

感谢任何建议！
1
你有 url: "php/project-contact-form.php",。如果所有文件都在根目录中，就不应该有 php/ 前缀。 - Barmar
1
你在控制台中看到任何404错误吗？ - Barmar
1
PHP脚本不应该关心它的位置。只要在$.ajax调用中提供正确的URL，它就应该工作。 - Barmar
1
你的变量名error很令人困惑。当没有错误时它是true。 - Barmar
1
抱歉 - 为了澄清，所有的php文件、js文件等都在根目录下的各自文件夹中。例如，所有的php文件都在$root/php/phpfile.php中。 - Tony
显示剩余19条评论
1个回答
1
我刚测试了你的代码，发现错误在于你的html代码中有 id="project-contact-us-button margin-bottom-35"，如下所示。
<button id="project-contact-us-button  margin-bottom-35" type="submit" class="btn btn-medium btn-rounded white bg-vb-red sbold-txt">SEND MESSAGE</button>

您需要将点击事件处理程序分配给project-contact-us-button。
//Project Contact us form
    $('#project-contact-us-button').on("click", function () {

为使您的代码正常工作，请删除 margin-bottom-35。ID不得包含空格（空格、制表符等），如www.w3schools.com/html/html_id.asp所述。我不知道那是否是一个打字错误，但这就是导致代码出错的原因。
<button id="project-contact-us-button" type="submit" class="btn btn-medium btn-rounded white bg-vb-red sbold-txt">SEND MESSAGE</button>

also if refering to a top level directory use ../

 url: "../php/project-contact-form.php",
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接