JSON迭代中的问题答案

【问题标题】：Issue in iteration over JSONJSON迭代中的问题
【发布时间】：2017-12-19 06:10:30
【问题描述】：

以下是 JSON 结构：

{
    "action": "organizationQueryResponse",
    "status": "SUCCESS",
    "matchCount": "2",
    "organizationDetailsList": [
            {
                "organizationDetails": {
                    "organizationID": "xxxxx",
                    "organizationName": "xxxx",
                    "parentOpCoName": "yyyy",
                    "registeredEmailID": "zzzz",
                    "registeredPhoneNo": "xxxx"
                }
            },
            {
                "organizationDetails": {                  
                    "organizationID": "xxxxx",
                    "organizationName": "xxxx",
                    "parentOpCoName": "yyyy",
                    "registeredEmailID": "zzzz",
                    "registeredPhoneNo": "xxxx"

                }
            }        
    ]
}

我只需要与 organizationDetails 键对应的值，并将这些值附加到 <tr> 中。我试过了，但总是得到一个凌乱的代码。请帮助编写一个 jQuery 函数。

这就是我正在尝试的。

success : function(response) {                   
            //process response here
            alert('Success !!!');

            $.each(response, function(key,val){
                if(key == 'organizationDetailsList'){
                    $.each(val, function(keys,vals){
                        $.each(vals, function(keys,values){
                            alert("key : "+keys+" ; value : "+values);
                        });                 
                    });                 
                }
            });
            }

【问题讨论】：

There's no such thing as a "JSON Object"
您的代码可能很乱，但是我们需要查看它以便教育您如何改进它。当然，有人可以用勺子喂给你答案，但你完全没有学到任何东西，而且当你将来遇到同样的问题时会再次回来。

标签： javascript jquery json

【解决方案1】：

这里有解决方案https://jsfiddle.net/jLr5vapn/

var data = {
    "action": "organizationQueryResponse",
    "status": "SUCCESS",
    "matchCount": "2",
    "organizationDetailsList": [
            {
                "organizationDetails": {
                    "organizationID": "xxxxx",
                    "organizationName": "xxxx",
                    "parentOpCoName": "yyyy",
                    "registeredEmailID": "zzzz",
                    "registeredPhoneNo": "xxxx"
                }
            },
            {
                "organizationDetails": {                  
                    "organizationID": "xxxxx",
                    "organizationName": "xxxx",
                    "parentOpCoName": "yyyy",
                    "registeredEmailID": "zzzz",
                    "registeredPhoneNo": "xxxx"

                }
            }        
    ]
};

// ----- getting the header
var headHTML = "<thead>";

var html = "<tbody>";

// ----- getting the row data
$.each(data.organizationDetailsList, function(i){
	html += "<tr>";
  if(i === 0)
  	headHTML += "<tr>";
  	$.each(data.organizationDetailsList[i].organizationDetails, function(key){
    	html += "<td>" + data.organizationDetailsList[i].organizationDetails[key] + "</td>";
      
      if(i === 0){
      	headHTML+= "<th>" + key + "</th>";
      }
    });
  html += "<tr>";
  
  if(i === 0)
  	headHTML += "</tr></thead>";
});

html += "</tbody>"

$('table').append(headHTML, html);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>

</table>

我已经提取了您的示例 JSON 数据并从中创建了一个表格。我已经使用了 $.each 无论你在使用什么，只是从该循环中创建了 html 并将其附加到表格中。

当 i 值为 0 时，

Header 也是由该 $.each 创建的。

【讨论】：