0

所以我试图通过 javascript 将一些信息从联系表发送到 php 函数。下面的代码片段:

$(function() {
    // Get the form.
    var form = $('#contact_form');

    // Get the messages div.
    var formMessages = $('#form-messages');

    // Set up an event listener for the contact form.
    $(form).submit(function(event) {

      // Stop the browser from submitting the form.
      event.preventDefault();
      
      // Serialize the form data.
      var formData = $(form).serialize();
      alert($(form).attr('action'));
      // Submit the form using AJAX.
      $.ajax({
          type: 'POST',
          url: $(form).attr('action'),
          data: formData
      })
      
      .done(function(response) {
            // Make sure that the formMessages div has the 'success' class.
            $(formMessages).removeClass('error');
            $(formMessages).addClass('success');

            // Set the message text.
            $(formMessages).text(response);

            // Clear the form.
            $('#name').val('');
            $('#email').val('');
            $('#message').val('');
        })
        
        .fail(function(data) {
            // Make sure that the formMessages div has the 'error' class.
            $(formMessages).removeClass('success');
            $(formMessages).addClass('error');

            // Set the message text.
            if (data.responseText !== '') {
                $(formMessages).text(data.responseText);
            } else {
                $(formMessages).text('Oops! An error occured and your message could not be sent.');
            }
        });
        
    });	
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="contact_form" method="post" class="form" role="form" action="/mailer.php">
    <div class="row">
        <div class="col-md-6 form-group">
            <label for="name"> Your name:</label>
            <input class="form-control" id="name" name="name" placeholder="Name" type="text" required maxlength="50" />
        </div>
        <div class="col-md-6 form-group">
            <label for="email"> Your email address:</label>
            <input class="form-control" id="email" name="email" placeholder="Email" type="email" required maxlength="50" />
        </div>
    </div>
    <div class="form-group">
      <label for="message"> Your message:</label>
      <textarea class="form-control" id="message" name="message" placeholder="Message" maxlength="6000" rows="7" required></textarea>
    </div>
    <br />
    <div class="row">
        <div class="col-md-12">
            <!-- <input type="submit" name="submit" value="Submit">-->
            <button class="btn btn-lg btn-success pull-right" name="submit" type="submit">Submit</button>
        </div>
    </div>
</form>
<div id="form-messages"></div>

<?php

//only process POST 
if(isset($_POST['submit'])){

    // This is in the PHP file and sends a Javascript alert to the client
    $message = "it is a post";
    echo "<script type='text/javascript'>alert('$message');</script>";

    //do something

} 
else {

    // Not a POST request, set a 403 (forbidden) response code.
    http_response_code(403);
    echo "There was a problem with your submission, please try again.";

    // This is in the PHP file and sends a Javascript alert to the client
    $message = "not POST";
    echo "<script type='text/javascript'>alert('$message');</script>";

    if(isset($_GET['submit'])) {
    echo "is GET";}
}?>

当我提交表单时,我知道 js 正在工作,因为我在 $.ajax({ 行之前弹出警报。

但是,然后php函数会回显“您的提交有问题,请重试。” 暗示 sumbit 方法不是 POST 吗?但后来我再也没有看到“是 GET”的回声......

我检查了 chromes 开发者模式 -> 网络,表单提交确实似乎是一个 POST。所以我不知道可能出了什么问题。

任何人都可以帮忙吗?

谢谢!

4

1 回答 1

1

暗示 sumbit 方法不是 POST 吗?

……因为不是。该serialize方法不包括提交按钮。(提交按钮仅在用于提交表单时是一个成功的控件,并且该表单没有被提交,JavaScript 是从它读取的提交数据)。

更改您的 PHP 以使用其他一些测试来查看是否正在发布表单数据。

于 2018-08-01T10:21:11.970 回答