AJAX 不调用 PHP 文件

我有一个联系我们表单,我正在尝试通过 AJAX 和 PHP 将表单数据发送到电子邮件地址。提交功能已成功触发,我收到了alert("success!");. 然而,该文件似乎form-process.php从未被执行 - 我从未收到过echo "I have got this far";,而且我当然也没有收到电子邮件。我哪里错了?


有关信息,我有一个暂存站点设置,因此文件已托管在服务器上。


超文本标记语言

<div class="modal" id="contactModal">

  <div class="modal-dialog">

    <div class="modal-content">

      <div class="modal-header">

        <h4 class="modal-title">Contact Us</h4>

        <button type="button" class="close" data-dismiss="modal">&times;</button>

      </div>


      <div class="modal-body">

        <form action="form-process.php" method="POST" id="contact-form" role="form">

          <div class="form-group">

            <input type="text" class="form-control my-2" name="name" placeholder="Full Name" />

            <input type="email" class="form-control my-2" name="email" placeholder="Email Address" />

            <textarea type="text" class="form-control my-2" name="message" rows="4" name="message" placeholder="Write your message here..."></textarea>

          </div>

          <input type="submit" name="submit" value="Submit" id="submit" class="btn btn-primary" form="contact-form"></input>

        </form>

      </div>


      <div class="modal-footer">

      </div>

    </div>

  </div>

</div>

查询

$(document).ready(function() {

  $('#contact-form').submit(function(event) {

    console.log('this has fired');


    var formData = {

        'name'              : $('input[id=name]').val(),

        'email'             : $('input[id=email]').val(),

        'message'           : $('input[id=message]').val()

    };


    event.preventDefault();

    $.ajax({

        type: "POST",

        url: "form-process.php",

        data: formData,

        success: function(msg){

            $("#contact-modal").modal('hide');

            alert("success!");

        },

        error: function(){

            alert("form post failed");

        }

    });

  });

});

慕哥6287543
浏览 85回答 2
2回答

慕的地10843

您使用以下方法来获取输入字段的值:$('input[id=name]').val(),$('input[id=email]').val(),$('input[id=message]').val()但您的输入都没有id字段:<input type="text" class="form-control my-2" name="name" placeholder="Full Name" /><input type="email" class="form-control my-2" name="email" placeholder="Email Address" /><textarea type="text" class="form-control my-2" name="message" rows="4" name="message" placeholder="Write your message here..."></textarea>&nbsp; &nbsp; &nbsp; </div>所以你可以用它来获取这些值:$(input[name="name"]).val();$(input[name="email"]).val();$(input[name="message"]).val();

慕田峪7331174

所有三个子formData对象都是空的 - 这三个带有 id 的输入选择器根本不存在,所以isset($_POST['name'])总是 false。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Html5