jQuery 解析/显示来自 php json_encode 的 json 数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15733972/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery parse/display json data from php json_encode
提问by carter
Initial .ajax call in jquery:
jquery 中的初始 .ajax 调用：
$.ajax({
type: 'post',
url: 'items_data.php',
data: "id="+id,
dataType: 'json',
success: function(data){
if(data){
make_item_rows(data);
}else{
alert("oops nothing happened :(");
}
}
});
Sends a simple string to a php file which looks like:
将一个简单的字符串发送到一个 php 文件，如下所示：
header('Content-type: application/json');
require_once('db.php');
if( isset($_POST['id'])){
$id = $_POST['id'];
}else{
echo "Danger Will Robinson Danger!";
}
$items_data = $pdo_db->query ("SELECT blah blah blah with $id...");
$result_array = $items_data->fetchAll();
echo json_encode($result_array);
I am catching the $result_array just fine and passing it on to another function. I double checked that there is indeed proper values being returned as I can just echo result to my page and it displays something like the following:
我正在捕获 $result_array 并将其传递给另一个函数。我仔细检查了确实有正确的值返回，因为我可以将结果回显到我的页面，它显示如下内容：
[{"item_id":"230","0":"230","other_id":"700"},{"item_id":"231","0":"231","other_id":"701"},{"item_id":"232","0":"232","other_id":"702"}]
I am having trouble figuring out how to iterate through the results so I can inject values into a table I have in my HTML. Here is what I have for my function:
我在弄清楚如何迭代结果时遇到了麻烦，这样我就可以将值注入到我的 HTML 中的表中。这是我的功能：
function make_item_rows(result_array){
var string_buffer = "";
$.each(jQuery.parseJSON(result_array), function(index, value){
string_buffer += value.item_id; //adding many more eventually
$(string_buffer).appendTo('#items_container');
string_buffer = ""; //reset buffer after writing
});
}
I also tried putting an alert in the $.each function to make sure it was firing 3 times, which it was. However no data comes out of my code. Have tried some other methods as well with no luck.
我还尝试在 $.each 函数中放置警报以确保它触发了 3 次，确实如此。但是，我的代码中没有数据。也尝试了一些其他方法，但没有运气。
UPDATE: I changed my code to include the parseJSON, no dice. Got an unexpected token error in my jquery file (right when it attempts to use native json parser). Tried adding the json header to no avail, same error. jquery version 1.9.1. Code as it is now should be reflected above.
更新：我更改了我的代码以包含 parseJSON，没有骰子。在我的 jquery 文件中出现意外的令牌错误（就在它尝试使用本机 json 解析器时）。尝试添加 json 标头无济于事，同样的错误。jquery 版本 1.9.1。现在的代码应该反映在上面。
回答by alasarr
Set the dataType:"JSON"and callback in your ajax call.
dataType:"JSON"在 ajax 调用中设置和回调。
For example:
例如：
$.ajax({
url: "yourphp.php?id="+yourid,
dataType: "JSON",
success: function(json){
//here inside json variable you've the json returned by your PHP
for(var i=0;i<json.length;i++){
$('#items_container').append(json[i].item_id)
}
}
})
Please also consider in your PHP set the JSON content-type. header('Content-type: application/json');
还请考虑在您的 PHP 中设置 JSON 内容类型。 header('Content-type: application/json');
回答by kero
You need to parse it with jQuery.parseJSON
你需要解析它 jQuery.parseJSON
function make_item_rows(result_array){
var string_buffer = "";
$.each(jQuery.parseJSON(result_array), function(index, value){
string_buffer = value.item_id;
$(string_buffer).appendTo('#items_container');
});
}
回答by writeToBhuwan
function make_item_rows(result_array){
var string_buffer = "";
var parsed_array=JSON.parse(result_array);
$.each(parsed_array, function(){
string_buffer += parsed_array.item_id;
$(string_buffer).appendTo('#items_container');
string_buffer = "";
});
}
回答by Mohammad Adil
Try this.
尝试这个。
function make_item_rows(result_array){
var string_buffer = "";
$.each(result_array, function(index, value){
value = jQuery.parseJSON(value);
string_buffer += value.item_id;
$(string_buffer).appendTo('#items_container');
string_buffer = "";
});
}
回答by Carlos
Assuming you already parsed the json response and you have the array. I think the problem is you need to pass a callback to $.each that takes and index and an element param
假设您已经解析了 json 响应并且您拥有数组。我认为问题是您需要将回调传递给 $.each ，该回调采用索引和元素参数
function make_item_rows(result_array){
$.each(result_array, function(index, element){
document.getElementById("a").innerHTML+=element.item_id;
});
}
回答by charlietfl
for starters within the $.eachyou need to access the properties of the instance of object contained within result_array, not result_arrayitself.
对于 中的初学者，$.each您需要访问 中包含的对象实例的属性result_array，而不是result_array其本身。
var string_buffer = "";
$.each(result_array, function(index, object){
/* instance is "object"*/
alert( object.item_id);
});
Not entirely sure what you are expecting from this line: $(string_buffer).appendTo('#items_container');
不完全确定您对这一行的期望： $(string_buffer).appendTo('#items_container');
$(string_buffer)does not create a valid jQuery selector since nothing within string_bufferhas a prefix for class, tagname or ID, and values from json don't either
$(string_buffer)不会创建有效的 jQuery 选择器，因为其中的任何内容string_buffer都没有类、标记名或 ID 的前缀，并且来自 json 的值也没有
If just want the string value of the item_idappended :
如果只想要item_id附加的字符串值：
$('#items_container').append( object.item_id+'<br/>');
If you are receiving this using jQuery AJAX methods you don't need to use $.parseJSONas other answers suggest, it will already be done for you internally provided you are setting correct dataType for AJAX
如果您使用 jQuery AJAX 方法接收此信息，则您不需要$.parseJSON像其他答案建议的那样使用它，只要您为 AJAX 设置正确的数据类型，它就会在内部为您完成
