Question

我想从json线（cownumber，weight，height）中提取特定值

使用Postman从URL访问时，JSON看起来像这样。

{
  "data": {
    "attributes": {
      "cownumber": "1234",
      "weight": 300,
      "height": 25
    },
    "type": "master_animal"
  },
  "links": {
    "self": "/master_animal/1234"
  }
}

我使用函数从URL

中提取cownumber

function getQueryVariable(variable)
{
       var query = window.location.search.substring(1);
       var vars = query.split("&");
       for (var i=0;i<vars.length;i++) {
               var pair = vars[i].split("=");
               if(pair[0] == variable){return pair[1];}
       }
       return(false);
}
</script>

然后使用该cownumber，我想从不同的URL中拉出json行

<script type = "text/javascript">
    $(document).ready(function(){
    $('#load').click(function(){
        var cownumber = getQueryVariable("cownumber")
        $.ajax({
                url: '/api/master_animal/'+cownumber,
                data: {},
                type: 'GET',
                datatype : 'json',
                success: function(data) {
                    var height = $(data['height']);
                    var weight = $(data['weight']);

                    $('#cownumber').val(cownumber);
                    $('#height').val(height);
                    $('#weight').val(weight);
                    console.log(data);
                },
                error: function(error) {
                    alert(JSON.stringify(error));
                }
            });

      });
    });
</script>

在我的网站上，我希望它能显示cownumber，weight和height。但它显示的只是cownumber（因为它从getQueryVariable函数中提取了该变量）。对于高度和重量，它显示“[对象]”

Picture of website side

我不确定从json行中提取必要变量的最佳方法是什么。我甚至不相信该函数实际上是获取json数据。

Answer 1

你试过吗？


    
    $(document).ready(function(){
    $('#load').click(function(){
        let cownumber = getQueryVariable("cownumber")
        $.ajax({
                url: '/api/master_animal/'+cownumber,
                type: 'GET',
                dataType : 'json',
                success: function(response) {
                    data = response['data']['attributes'];
                    let height = $(data['height']);
                    let weight = $(data['weight']);

                    $('#cownumber').val(cownumber);
                    $('#height').val(height);
                    $('#weight').val(weight);
                    console.log(data);
                },
                error: function(error) {
                    alert(JSON.stringify(error));
                }
            });

      });
    });

Answer 2

首先，您访问的数据是错误的。仅仅因为您的变量名为data并不意味着您对数据的访问权限已经在data属性。这意味着你需要像这样访问数据

var height = data.data.attributes.height;

此外，您不需要在jQuery中包装您的值。只需获取价值并使用它

var height = data.data.attributes.height;
$('#height').val(height);

Answer 3

height和weight属性进一步嵌套在attributes内的响应对象中：

success: function(response) {
  var height = response.data.attributes.height;
  var weight = response.data.attributes.weight;

  $('#cownumber').val(cownumber);
  $('#height').val(height);
  $('#weight').val(weight);
},

Answer 4

使用此utils函数从嵌套对象中提取任何值。

getValueAtPath(obj, path, def){

    if(!obj) return def;

    path = path.split('.');
    let i, len;
    len = path.length;

    for(i = 0; i < len; i++){
        if(!obj || typeof obj !== 'object') return def;
        obj = obj[path[i]];
    }

    if (obj === undefined) return def;

    return obj;
}

在您的情况下，要获得cownumber，weight，height，您只需

let cowNumber = getValueatPath(jsonData, 'data.attributs.cownumber', defualtvalue) 

let height = getValueatPath(jsonData, 'data.attributs.height', defualtvalue) 

let weight = getValueatPath(jsonData, 'data.attributs.weight', defualtvalue)

希望这会有所帮助;

Ajax：从json行

4 个答案: