Ajax 没有在响应的 php 页面上将正确的数据传递给 $_POST

Question

我有一个 ajax 函数：

$('#addSiteButton').on('click',function() {
  let addSiteOption = $('#enterNewWebsiteLink').val();
  const form = new FormData();

 form.append('addSiteOption', addSiteOption);

 $.ajax({
  url: "includes/submit_site.php",
  data: { 'data': form },
  method: "POST",
  contentType: false,
  processData: false,
  enctype: false,
  cache: false,
  datatype: "text",

 success: function (response, data) {
  }
});

我的 PHP 文件如下所示：

if (isset($_POST['data'])) {
 $websitelink = $_POST['addSiteOption'];
}

我的 HTML 如下所示：

<input type="url" form="addsite" class="enterNewWebsiteLink" 
  id="enterNewWebsiteLink"
  name="enterwebsitelink"
  placeholder="Enter A New Website">

我得到的错误是：Warning: Undefined array key "data" 我试过输出变量addSiteOption，它正确输出了URL。

令人沮丧的事情是，我一直在检查/复制它与我之前做过的项目的对比，但我现在无法在它们之间做出任何区别。

我从服务器收到该页面的 200 响应。

Answer 1

你不能序列化FormData，而processData: false告诉jQuery不要尝试序列化data:选项。

您应该将FormData 作为data: 选项传递。那么FormData 的键就会变成$_POST 的键。

JS：

$('#addSiteButton').on('click',function() {
  let addSiteOption = $('#enterNewWebsiteLink').val();
  const form = new FormData();

 form.append('addSiteOption', addSiteOption);

 $.ajax({
  url: "includes/submit_site.php",
  data: form,
  method: "POST",
  contentType: false,
  processData: false,
  enctype: false,
  cache: false,
  dataType: "text",

 success: function (response, data) {
  }
});

PHP：

if (isset($_POST['addSiteOption'])) {
 $websitelink = $_POST['addSiteOption'];
}

你还有一个错字：datatype: 应该是 dataType: