Question

我想不出一个更好的头衔，但这里有解释：

我正在制作一个如下所示的ajax请求：

...
xmlhttp.send("data1=" + $data);
...

document.getElementById("data1display").innerHTML= xmlhttp.responseText;
...

现在页面已经开发了，我想将另一个变量data2发送到同一个php页面进行处理。

我意识到我可以像"data1=" + $data + "data2=" + $data2

那样将数据添加到xmlhttp.send

但是！如何拆分响应以更新两个单独的元素？（data1display和data2display）。

构建响应的代码：

if ( isset( $_POST["data1"] ) ) 

 die($object->function()); //returns html to fill the specified element.

Answer 1

如果你的php处理页面发回JSON而不是html，你可以期待以下内容：

{
    "data1display": "<div>whatever</div>",
    "data2display": "<div>something</div>"
}

然后在你的js成功回调中，你可以做类似的事情：

var targetIdArray = ["data1display", "data2display"];
var responseJSON = JSON.parse(xmlhttp.responseText);
for (var i = 0; i < targetIdArray.length; i++) {
    document.getElementById(targetIdArray[i]).innerHTML= responseJSON[targetIdArray[i]];
}

如果你想在响应中坚持使用html，你可以在响应的每个部分添加一个类或ID，并使用常规的旧jQuery选择器从响应中获取正确的节点。

最终，您可能希望更改前端框架，因此最好只传回要呈现的数据并让客户端呈现它。这意味着根本不会将html传回客户端，而是使用一些模板解决方案，如handlebars。

{
    "data1display": "whatever",
    "data2display": "something"
}

然后你可以制作一些小模板，如：

<div>{{ content }}</div>

并在客户端中呈现它们。

Answer 2

你不能putan if声明并说出这个请求是否已设置然后执行

document.getElementById（＆＃34; data1display＆＃34;）。innerHTML = xmlhttp.responseText;

否则这样做

document.getElementById（＆＃34; data2＆＃34;）。innerHTML = xmlhttp.responseText;

只需在您的ajax

中添加if语句即可

你如何拆分AJAX响应，这样你就不必提出多个请求？

2 个答案: