Question

如何使用jquery从json格式读取数据。下面是我试过的，但不幸的是我无法读取我想要的确切数据。

 $.ajax({
            url: '@Url.HttpRouteUrl("GetDistrictList", new { })',
            type: 'GET',
            datatype: "json",
            success: function (data, txtStatus, xhr) {
                console.log(data);
                if (data != null) {

                    $.each(data, function (i, item) {
                        alert(data[0]);
                        alert(data[0].DistrictCode)
                        alert(item);
                        alert(item[0]);
                        alert(item.DistrictCode);
                        $('#tblDistricts > tbody').append('<tr><td>'+item.DistrictCode+'</td><td>test</td><td>test</td><td>test</td><td>test</td><td>test</td></tr>');

                    })
                }
            },
            error: function (xhr, textStatus, errorThrown) { 
                console.log("error in GetDistrictList : " + errorThrown);
            }
        });'

在警告框中，我只是'未定义'或'[对象] [对象]，我无法读取确切的数据。我被困在这里。

编辑： Web api将数据作为List对象返回。

[HttpGet]
        [Route("GetDistrict/", Name = "GetDistrictList")]
        public List<DistrictModels> GetDistrictList()
        {

            BAL_District oBAL_District = new BAL_District();

            return oBAL_District.GetDistrictList();

        }

Answer 1

使用import alt from '../../alt'; import cookie from 'react-cookie'; class LoginActions { constructor(){ this.generateActions( 'updatePassword', 'updateName', 'loginSuccess', 'loginFail', 'remember' ); } // Generic get request post(url, data, callback) { var xhr = new XMLHttpRequest(); xhr.open('POST', url, true); xhr.onreadystatechange = function() { if (xhr.readyState == 4) { if (xhr.status == 200) { callback(null, xhr.responseText); } else { callback(xhr.statusText); } } }; xhr.send(data); } // Get actual content login(name, password, remember) { var data = "name="+name+"&password="+password+"&remember="+remember; this.post('api/login', data, function(err, data) { if (!err) { this.actions.loginSuccess(data.message); } else { this.actions.loginFail(JSON.parse(data.message)); } }).bind(this); } } export default alt.createActions(LoginActions);

实施例

handleSubmit(event){
    event.preventDefault();

    var name = this.state.name;
    var password = this.state.password;
    var remember = this.state.remember;

    LoginActions.login(name, password, remember);

  }

var Data = $.parseJSON(response);将Javascript对象转换为JSON文本，并将该JSON文本存储在字符串中。

var obj = jQuery.parseJSON( '{ "name": "John" }' ); alert( obj.name === "John" );将一串JSON文本转换为Javascript对象。

How to access JSON object

仅供参考，自jQuery 3.0起，不推荐使用$ .parseJSON。要解析JSON对象，请改用原生JSON.parse方法。

JSON.stringify

JSON.parse

Answer 2

我想你想调用这个函数 - http://api.jquery.com/jquery.parsejson/

Answer 3

如果你得到[object，object]，这意味着你已经获取了Json对象。如果您需要一些说明，请分享您想要的Json。谢谢

Answer 4

使用JSON.stringify(object)。这是打印出来的超级安全方式。

   $.ajax({
        url: '@Url.HttpRouteUrl("GetDistrictList", new { })',
        type: 'GET',
        datatype: "json",
        success: function (data, txtStatus, xhr) {
            console.log(data);
            if (!!data) {
                // '!data' means data variable is not available and '!!data' returns true:boolean if variable is valid

                //idx is 'index', I made the code as a loop. It will not work if array is empty. 
                //It is good way to avoid error
                for(var idx in data){
                    if(idx == 0) {
                        //JSON.stringify makes object type to string type. It is safe to use since it is a native javascript function
                        alert(JSON.stringify(data[idx]);
                        //You can access member by 'data[idx].memberName'
                        //DOM adding code can be here
                    }
                }
            }
        },
        error: function (xhr, textStatus, errorThrown) { 
            console.log("error in GetDistrictList : " + errorThrown);
        }
    });

Answer 5

假设您的服务器端脚本没有设置正确的Content-Type: application/json响应头，您需要使用dataType: 'json'参数向jQuery指示这是JSON。

您不应在data中使用$.each()变量。然后，您可以使用$.each()函数循环遍历数据：

$.ajax({
    url: '@Url.HttpRouteUrl("GetDistrictList", new { })',
    type: 'GET',
    datatype: "json",
    success: function (data, txtStatus, xhr) {
        console.log(data);
        if (data != null) {

            $.each(data, function (index, element) {
                alert(element);
                alert(element[0]);
                alert(element.DistrictCode);
                $('#tblDistricts > tbody').append('<tr><td>'+element.DistrictCode+'</td><td>test</td><td>test</td><td>test</td><td>test</td><td>test</td></tr>');
            });
        }
    },
    error: function (xhr, textStatus, errorThrown) { 
        console.log("error in GetDistrictList : " + errorThrown);
    }
});'

或使用$.getJSON方法：例如：

$.getJSON('/functions.php', { get_param: 'value' }, function(data) {
    $.each(data, function(index, element) {
        $('body').append($('<div>', {
            text: element.name
        }));
    });
});

注意：从jQuery 3.0开始，$.parseJSON已弃用。要解析JSON对象，请改用原生JSON.parse方法。

如何使用jquery从json格式读取数据

5 个答案: