联系表格无法正常运作

时间:2016-02-27 18:27:16

标签: javascript php html

我是一名程序员新手,所以我复制了一份联系表格并将其粘贴在我的网站上。问题是它不能正常工作。当我按下发送按钮时,它显示:&#34;对不起丹尼尔,似乎我的邮件服务器没有响应。请稍后再试!&#34;。也许我以错误的方式包含php(我使用<include("mail/contact_me.php");></include(>)... IDK 我在HTML中粘贴了php,因为我没有在代码片段中找到php部分:D

&#13;
&#13;
$(function() {

  $("#contactForm input,#contactForm textarea").jqBootstrapValidation({
    preventSubmit: true,
    submitError: function($form, event, errors) {
      // additional error messages or events
    },
    submitSuccess: function($form, event) {
      // Prevent spam click and default submit behaviour
      $("#btnSubmit").attr("disabled", true);
      event.preventDefault();

      // get values from FORM
      var name = $("input#name").val();
      var email = $("input#email").val();
      var phone = $("input#phone").val();
      var message = $("textarea#message").val();
      var firstName = name; // For Success/Failure Message
      // Check for white space in name for Success/Fail message
      if (firstName.indexOf(' ') >= 0) {
        firstName = name.split(' ').slice(0, -1).join(' ');
      }
      $.ajax({
        url: "././mail/contact_me.php",
        type: "POST",
        data: {
          name: name,
          phone: phone,
          email: email,
          message: message
        },
        cache: false,
        success: function() {
          // Enable button & show success message
          $("#btnSubmit").attr("disabled", false);
          $('#success').html("<div class='alert alert-success'>");
          $('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
            .append("</button>");
          $('#success > .alert-success')
            .append("<strong>Your message has been sent. </strong>");
          $('#success > .alert-success')
            .append('</div>');

          //clear all fields
          $('#contactForm').trigger("reset");
        },
        error: function() {
          // Fail message
          $('#success').html("<div class='alert alert-danger'>");
          $('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
            .append("</button>");
          $('#success > .alert-danger').append("<strong>Sorry " + firstName + ", it seems that my mail server is not responding. Please try again later!");
          $('#success > .alert-danger').append('</div>');
          //clear all fields
          $('#contactForm').trigger("reset");
        },
      })
    },
    filter: function() {
      return $(this).is(":visible");
    },
  });

  $("a[data-toggle=\"tab\"]").click(function(e) {
    e.preventDefault();
    $(this).tab("show");
  });
});

// When clicking on Full hide fail/success boxes
$('#name').focus(function() {
  $('#success').html('');
});
&#13;
<?php // Check for empty fields if(empty($_POST[ 'name']) || empty($_POST[ 'email']) || empty($_POST[ 'phone']) || empty($_POST[ 'message']) || !filter_var($_POST[ 'email'],FILTER_VALIDATE_EMAIL)) { echo "No arguments Provided!"; return false; } $name=$
_POST[ 'name']; $email_address=$ _POST[ 'email']; $phone=$ _POST[ 'phone']; $message=$ _POST[ 'message']; $to='dynamitestoynev@gmail.com' ; $email_subject="Website Contact Form:  $name" ; $email_body="You have received a new message from your website contact form.\n\n"
. "Here are the details:\n\nName: $name\n\nEmail: $email_address\n\nPhone: $phone\n\nMessage:\n$message"; $headers="From: noreply@mywebsite.com\n" ; $headers .="Reply-To: $email_address" ; mail($to,$email_subject,$email_body,$headers); return true; ?>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-lg-6 col-lg-offset-3 text-center">
  <form name="sentMessage" id="contactForm" novalidate>
    <div class="row control-group">
      <div class="form-group col-xs-12 floating-label-form-group controls">
        <label>Име</label>
        <input type="text" class="form-control" placeholder="Име" id="name" required data-validation-required-message="Моля, въведете името си.">
        <p class="help-block text-danger"></p>
      </div>
    </div>
    <div class="row control-group">
      <div class="form-group col-xs-12 floating-label-form-group controls">
        <label>Email Адрес</label>
        <input type="email" class="form-control" placeholder="Email" id="email" required data-validation-required-message="Моля, въведете email адреса си.">
        <p class="help-block text-danger"></p>
      </div>
    </div>
    <div class="row control-group">
      <div class="form-group col-xs-12 floating-label-form-group controls">
        <label>Телефон</label>
        <input type="tel" class="form-control" placeholder="Телефон" id="phone" required data-validation-required-message="Моля, въведете телефонния си номер.">
        <p class="help-block text-danger"></p>
      </div>
    </div>
    <div class="row control-group">
      <div class="form-group col-xs-12 floating-label-form-group controls">
        <label>Съобщение</label>
        <textarea rows="5" class="form-control" placeholder="Съобщение" id="message" required data-validation-required-message="Моля, въведете съобщението си."></textarea>
        <p class="help-block text-danger"></p>
      </div>
    </div>
    <br>
    <div id="success"></div>
    <div class="row">
      <div class="form-group col-xs-12">
        <button type="submit" value=" Submit " name="submit" class="btn btn-primary btn-xl">Send</button>
      </div>
    </div>
  </form>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

您目前的代码对于简单的联系表单来说似乎很复杂。我刚刚在我的网站http://ddry.co.uk/contact_us.html使用bootstrap 3框架创建了一个联系表单。我已经为JSFiddle提供了您需要的代码。它包括一个简单的反垃圾邮件过滤器,所以如果用户提供了错误的答案,我有一个html重定向指示用户,如果用户提供显示SUCCESS html页面的正确答案,它也有重定向。您需要将PHP文件上载到服务器,以便在测试期间使用。 (帖子底部的PHP代码)。如果您需要任何帮助,请询问。希望这会有所帮助: - )

https://jsfiddle.net/andydry1/bmh3f5ur/1/

------- PHP代码------

 <?php
   function isEmail($clientEmail) {
   return filter_var($clientEmail, FILTER_VALIDATE_EMAIL);}

 if($_POST){
  // Enter the email where you want to receive the message
   $myemail = 'your-email';
   $name = addslashes(trim($_POST['name']));
   $clientEmail = addslashes(trim($_POST['email']));
   $subject = addslashes(trim($_POST['phone']));
   $phone = addslashes(trim($_POST['phone']));
   $message = addslashes(trim($_POST['message']));
   $antispam = addslashes(trim($_POST['antispam']));
   if($antispam == '12' && isEmail($clientEmail) && $phone != '' && $message != ''   ){
    $to = $myemail;
    $email_subject = "Contact form submission: $name";
    $email_body = "You have received a new message. ".
    " Here are the details:\n Name: $name \n ".
    "Email: $clientEmail\n Message: \n $message\n Phone: $phone";
    $headers = "From: $myemail\n";
    $headers .= "Reply-To: $clientEmail";
    mail($to,$email_subject,$email_body,$headers);
    echo json_encode($array);
    header('Location: success.html'); }
    else {
    header('Location: failed-message.html'); }
  }?>

注意

别忘了改变:

你的电子邮件

位置:success.html

位置:failed-message.html

还包括所有相关的bootstrap 3 css文件