Question

首先，我知道之前已经提出过这个问题的变化。但是，在前面的所有示例中，问题的提问者一直在使用Ajax看起来像这样：

$.ajax({
    type: "POST",
    url: 'logtime.php',
    data: "userID=" + userID;
});

然而我对这种风格并不熟悉。我被教导制作Ajax请求的方式是使用以下形式的代码：

var xhr = new XMLHttpRequest();
xhr.open("GET", "data.php");
xhr.send();

xhr.onreadystatechange = function() {
    if(xhr.readyState === 4) {
        //DEFINE CALLBACK FUNCTION
    }
}

因此，使用我熟悉的上述Ajax样式，如何将数据发送到服务器以由我的php文件data.php处理？我知道将它包含在xhr.send()括号中是有意义的，但我不确定这是怎么做到的？

此外，如果我们希望从数据库中检索数据，是否可以使用GET方法，但是必须为php提供一个变量才能从数据库中选择正确的数据？

最后，我教过的Ajax方法与我提到的其他方法之间的区别是什么，我经常在SO上看到它？

感谢。

Answer 1

请尝试：

  `xhr.send('you_user=user&your_password=password');`

......或者可以使用更优雅的东西：

var d = new FormData();
d.append('you_user', 'user');
d.append('your_passowrd', 'password');
// ...
xhr.send(d);

Answer 2

这有很多层次。

HTTP支持许多具有不同用途的methods。

简单来说，主要是GET和POST。 GET用于询问数据，在向服务器发送数据以更改内容时使用POST。

在GET请求中，您要发送到服务器的任何数据通常使用查询字符串（使用the application/x-www-form-urlencoded scheme编码）在URL中进行编码。

在POST请求中，数据通常放在请求正文中，通常也会使用application / x-www-form-urlencoded。如果你想上传文件，那么你可以使用multipart / form-data。

使用此算法可能最简单地编码数据：

（这不是最有效的方法，但它清楚地显示了步骤。）

var data = [
    { key: "Foo", value: "a a a" },
    { key: "Bar", value: "b b b" },
    { key: "Baz", value: "c c c" }
];

var key_value_pairs = [];

for (var i = 0; i < data.length; i++) {
    var pair = encodeURIComponent(data[i].key) + "=" + encodeURIComponent(data[i].value);
    key_value_pairs.push(pair);
}

var query_string = key_value_pairs.join("&");

var url = "data.php" + "?" + query_string;

var xhr = new XMLHttpRequest();
xhr.open("GET", url);
xhr.send();

如果您想发出POST请求，那么它几乎是一样的。你只需改变结束：

var xhr = new XMLHttpRequest();
xhr.open("GET", "data.php");
xhr.send(query_string);

最后，我教过的Ajax方法与我提到的其他方法之间的区别是什么，我经常在SO上看到它？

它使用jQuery库（但不是一个很好的例子）。您可以看到它手动构造查询字符串的位置（"userID=" + userID），但它无法使用编码例程。使用jQuery时的安全方法是将对象传递给数据：

$.ajax({
    type: "POST",
    url: 'logtime.php',
    data: { userID: userID }
});

使用Ajax时，应该如何将变量从JavaScript传递到PHP？

2 个答案: