简体   繁体   English

带有JSON响应的jQuery GET。 选择特定对象

[英]JQuery GET with JSON response. Select specific objects

I'm working on a simple web app. 我正在开发一个简单的Web应用程序。 This will have the client enter a license plate, then connect to a Socrata-based OpenData API which contains the records of all registered cars in my country. 这将使客户输入车牌,然后连接到基于Socrata的OpenData API,该API包含我国所有已注册汽车的记录。

Using the license plate, it must find the correct car, and display specific information. 它必须使用车牌找到正确的汽车,并显示特定信息。 The kind of information displayed will differ, as I intend to use this app on several different web pages, but as a starting point I'd like to display the car's brand and model. 显示的信息类型会有所不同,因为我打算在几个不同的网页上使用此应用程序,但是作为起点,我想显示汽车的品牌和型号。 These are listed in the array as 这些在数组中列为

"merk" : "KIA"
"handelsbenaming" : "PICANTO"

Where 'Merk' is the brand/manufacturer and 'handelsbenaming' is the model. 其中“默克”是品牌/制造商,“ handelsbenaming”是模型。

I am not very experienced with javascript, and completely new to JQuery, but I managed to come up with this: 我对javascript不太熟悉,并且对JQuery完全陌生,但是我设法做到了这一点:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
var kenteken = "1KBB00";

$(document).ready(function(){
    $("button").click(function(){
$.get("https://opendata.rdw.nl/resource/m9d7-ebf2.json",{kenteken: kenteken},function(data, status){
        alert("Data: " + data + " Status: " + status);});
 });
});

</script>
</head>
<body>

<button>Click</button>
</body>

As you can see, the JQuery is fired by pushing the button. 如您所见,通过按下按钮将触发JQuery。 I'll make an input field to get the license plate number later on, but in for testing purposes I simply defined the variable "kenteken" to be a real license plate. 稍后,我将在输入字段中获取车牌号,但出于测试目的,我仅将变量“ kenteken”定义为真实的车牌。 Also for testing purposes I would like to return the response in an alert box. 同样出于测试目的,我想在警报框中返回响应。

On testing, the console in Firefox does not indicate any errors. 经过测试,Firefox中的控制台不会显示任何错误。 I can also see the GET request is made, and a JSON array is returned. 我还可以看到发出了GET请求,并返回了JSON数组。 However, I cannot get the array to write to the document or the alert box. 但是,我无法使数组写入文档或警报框。 Currently, the alert shows: 当前,警报显示:

Data: [object Object] Status: success

Whereas, as far as I understand, 'Data' should display the entire JSON array which is returned by the GET request 据我所知,“数据”应显示GET请求返回的整个JSON数组

I used Google, read through the documentation that came with the API multiple times, I've read through more posts on SO than I can keep count of, but I'm not getting it. 我使用Google,多次阅读了API随附的文档,阅读了SO上更多的文章,这远远超出了我的预期,但我没有得到。

when you get your data back it comes as a string. 当您取回数据时,它以字符串形式出现。

Turn it back into a JSON object using JSON.Parse(data) and the you should get it to look correctly. 使用JSON.Parse(data)将其转换回JSON对象,您应该使它看起来正确。 Put a breakpoint before your alert and then you can inspect what comes back and what the json method does. 在警报之前放置一个断点,然后您可以检查返回的内容和json方法的作用。

$.get("https://opendata.rdw.nl/resource/m9d7-ebf2.json",{kenteken: kenteken},function(data, status){
        debugger;
        var jsonData = JSON.Parse(data);
        alert("Data: " + jsonData + " Status: " + status);});
 });

The response is not a single object, it's an array of objects, so you need to index them to access the properties. 响应不是单个对象,而是一个对象数组,因此您需要为它们建立索引以访问属性。 I show below how to access the first one, but in your real code you would probably loop. 我在下面显示了如何访问第一个,但是在您的真实代码中您可能会循环。

$.getJSON("https://opendata.rdw.nl/resource/m9d7-ebf2.json",{kenteken: kenteken},function(data, status){
    alert("Merk: " + data[0].merk + " Handelsbenaming: " + data[0]. handelsbenaming + " Status: " + status);});
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM