Question

我有一个带输入字段的简单div，用于插入团队数据的数据

    <div>
      <label>Register</label>
      <input type="text" name="nt" placeholder="Team Name">
      <label>Team</label>
      <input type="text" name="n1" placeholder="Steam username">
      <input type="text" name="n2" placeholder="Steam username">
      <input type="text" name="n3" placeholder="Steam username">
      <input type="text" name="n4" placeholder="Steam username">
      <input type="submit" id="sbutton"></input>
    </div>

然后我使用Jquery收集数据并将其发送到我的php文件。

$('#sbutton').click(function(){
      var sdata=[];
      $(this).parent().children("input[type=text]").each(function(index,value){
          index = $(this).attr("name");
          value = $(this).val();
          sdata[index]=value;
      });
      console.log(sdata);
      $.post('php/team.php',sdata,
          function(returnedData){
              console.log(returnedData);
      });
  });

在我的php文件中我处理该数据，但问题是，jquery函数没有传递。我的php：

<?php
session_start();
include_once "functions.php";
print_r($_POST);
if(!isset($_POST["nt"])) die("Usernames not set");?>

我的控制台日志：

[nt: "asdasd", n1: "asdasd", n2: "asdasd", n3: "asdasd", n4: "asdasd"]
jquery-2.1.4.min.js:4 XHR finished loading: POST
"http://localhost/tournament/php/team.php".k.cors.a.crossDomain.send
 @ jquery-2.1.4.min.js:4n.extend.ajax @ jquery-2.1.4.min.js:4n
(anonymousfunction) @ jquery-2.1.4.min.js:4(anonymous function) @ main_page.php:31n.event.dispatch @ jquery-2.1.4.min.js:3r.handle @ jquery-2.1.4.min.js:3
main_page.php:33 Array
(
)
Usernames not set

为什么会这样？

Answer 1

更改为对象并设置具有输入名称的对象的属性名称以使用您当前使用的相同php方法

$('#sbutton').click(function(){
  var sdata={};
  $(this).parent().children("input[type=text]").each(function(index,value){

      sdata[this.name]=this.value;
  });
  console.log(sdata);
  $.post('php/team.php',sdata,
      function(returnedData){
          console.log(returnedData);
  }).fail(function(){alert('Ooops something wrong')});
});

通过返回整个$_POST，您可以非常轻松地看到收到的内容，它将显示在成功处理程序的控制台日志中。

echo json_encode($_POST);exit;

Answer 2

您也可以像这样使用FormData对象，即使您似乎没有在HTML中定义<form>

FormData对象允许您编译一组要使用XMLHttpRequest发送的键/值对。它主要用于发送表单数据，但可以独立于表单使用，以便传输密钥数据。如果表单的编码类型设置为multipart / form-data，则传输的数据格式与表单的submit（）方法用于发送数据的格式相同。

$('#sbutton').click(function(){
    var formData = new FormData();

    $(this).parent().children("input[type=text]").each(function(index,value){
        formDate.append( $(this).attr("name"), $(this).val() );
    });
    $.post('php/team.php',formData,
          function(returnedData){
              console.log(returnedData);
          })
          .fail(function(){alert('Ooops something wrong')});
});

Answer 3

只需替换

// dictionary, i.e. sdata["nt"] would not work
var sdata=[];

通过

// dictionary, i.e. sdata["nt"] would work
var sdata={};

JQuery对您传递的数据使用JSON.stringify方法

如果您有疑问，请尝试使用

console.log(JSON.stringify(sdata))

Jquery AJAX没有传递“POST”数据

3 个答案: