如何使用 jquery /javascript 处理 Json答案

【问题标题】：How to process Json using jquery /javascript如何使用 jquery /javascript 处理 Json
【发布时间】：2011-08-17 07:43:57
【问题描述】：

嗨，我的 setDefaultPoint 控制器以 json 格式返回地图...代码如下

def setDefaultPoint = {
    if (springSecurityService.isLoggedIn()) {
        def officeId = params.officeId          
        def officeRoleInstance=OfficeRole.get(officeId)
        def company= officeRoleInstance.company
        def defaultPoint = officeRoleInstance.distanceChart.officePoint
        def map = [defaultPoint:defaultPoint]
        map << [company:company]
        def json = map as JSON
        render json
    }

向这个控制器发送请求的ajax调用是

function setDefaultPoint(){
        var officeId =  $('#clientTrip_officeId').val();

        $.ajax({
            url:"${createLink(controller:'clientTrip',action:'setDefaultPoint')}",
            dataType: "json",
            data:({officeId: officeId}),
            success: function(data) {

                // here i want to get the id and name of default point and id and name of company...
        console.log('id of defaultpoint is---"+????) 
                    console.log('name of default point is---"+????)
                    console.log(id of company is-----------"+?????)        
            }

        }); 
    }

我从 json 传递了两个不同的对象.. 那么如何获取这些对象的属性... defaultPoint 对象和 Company 对象都有名为 id 和 anme 的字段

响应看起来像

 {"defaultPoint":{"class":"com.springpeople.steer.trips.Point","id":3,"name":"MG road"},"company":{"class":"com.springpeople.steer.partymodel.parties.Company","id":5,"addressPermanent":{"class":"Address","id":3},"contactDetails":null,"name":"Infosys","offices":[{"class":"OfficeRole","id":6}],"organizationRoles":[{"class":"OrganizationRole","id":5}],"panNumber":null,"serviceTaxNumber":null,"tanNumber":null}}

【问题讨论】：

标签： jquery ajax json grails

【解决方案1】：

由于返回的dataType被指定为json，所以传递给分配给success的函数的data参数将是从返回的json字符串解析的JavaScript对象，只要该字符串是有效的json。在 ajax 调用中传递的 data 不需要它周围的括号。这应该工作

function setDefaultPoint(){
    var officeId =  $('#clientTrip_officeId').val();

    $.ajax({
        url:"${createLink(controller:'clientTrip',action:'setDefaultPoint')}",
        dataType: "json",
        data: { officeId: officeId },
        success: function(data) {
            console.log(data.defaultPoint.id, data.defaultPoint.name);
            console.log(data.company.id, data.company.name);
        }

    });
}

【讨论】：

【解决方案2】：

var obj = jQuery.parseJSON(data);

然后您可以访问诸如obj.class 之类的内容。

文档： http://api.jquery.com/jQuery.parseJSON/

【讨论】：

默认点对象和公司对象都有一个名为 id 和 name 的字段如何获取这些
@Russ 提出了一个很好的观点，因为 dataType 设置为 JSON，所以您不需要 parseJSON。要访问这些字段，请执行此操作 data.defaultPoint.id 和 data.company.id

【解决方案3】：

如果你设置了dataType: "json"，你不需要在你的成功回调中设置parseJSON

alert(data.class);

【讨论】：

【解决方案4】：

因为您已将 dataType 指定为 Json，所以 jQuery 会将响应解析为一个对象，因此您应该可以使用：

function setDefaultPoint(){
        var officeId =  $('#clientTrip_officeId').val();

    $.ajax({
        url:"${createLink(controller:'clientTrip',action:'setDefaultPoint')}",
        dataType: "json",
        data:({officeId: officeId}),
        success: function(data) {

            // here i want to get the id and name of default point and id and name of company...
    console.log(data.defaultPoint.Id)         
        }

    }); 
}

【讨论】：