Question

我想使用AJAX将FormData发送到我的PHP文件，但是当我点击按钮时出现错误undefined index fname。

<form id="myForm" method ="post" enctype="multipart/form-data">
    First Name: <input type="text" name="fname" id="fname" /> <br>
    Last Name: <input type="text" name="lname" id="lname" /> <br>
    Email:  <input type="text" name="email" id="email" /> <br>
    Image: <input type="file" name="image" id="image" /> <br>
    <button type="button" name="btnSubmit" id="btnSubmit"> Submit </button>
</form>

<script language="javascript" src="js/jquery-1.9.1.min.js"></script>
<script language="javascript" src="js/jquery.form.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
    //alert(4);
    $("#btnSubmit").click(function(){
         var formData = new FormData($("#myForm"));
         alert(formData);
         console.log(formData);
         $.ajax({
            type: 'POST',
            url: 'learn_form2.php',
            data: formData,
             success: function (data) {
               alert(data);
             },
            cache: false,
            contentType: false,
            processData: false
          });
      }); 
    });
</script>

<?php
    echo $_REQUEST['fname'];
?>

请帮忙

Answer 1

请注意FormData需要form DOMElement，而不是jQuery对象。另请注意，您应该绑定submit本身的form事件，而不是单击提交按钮。这样就可以阻止标准表单提交。试试这个：

$("#myForm").submit(function(e) {
     e.preventDefault(); // stop standard form submission

     var formData = new FormData(this); // give the form DOMElement to FormData
     $.ajax({
         type: 'POST',
         url: 'learn_form2.php',
         data: formData,
         success: function (data) {
             alert(data);
         },
         cache: false,
         processData: false
    });
});

Answer 2

您应该使用DOM表单元素而不是jQuery对象来构造FormData。像这样的东西

new FormData($("#myForm")[0]);

也可以解决潜在的问题，以便在你的ajax调用上实现错误处理程序。

ajax没有向php发送数据

2 个答案: