gpt4 book ai didi

javascript - 从 AJAX 请求获取 JSON 数据并使用随机项填充

转载 作者:行者123 更新时间:2023-11-28 18:38:14 25 4
gpt4 key购买 nike

我正在尝试从 AJAX 请求接收 JSON 数据,然后找到一种方法来显示其中的随机项目。我还想将此数据存储在 localStorage 中,以便后续请求不会发送到数据库,以便一旦存在于 localStorage 中,就会从其中选择随机项。

例如,我的 JSON 数据如下所示:

{
"tennis": [
{
"Description": "Insert description here",
"Address": "24 Fakeville St",
"Courts": 4
},
{
"Description": "Insert description here",
"Address": "18 Fakeville St",
"Courts": 2
}
],
"soccer": [
{
"Description": "Insert description here",
"Address": "18 Fakeville St",
"Courts": 1
},
{
"Description": "Insert description here",
"Address": "18 Fakeville St",
"Courts": 1
}
],
"basketball": [
{
"Description": "Insert description here",
"Address": "4 Fakeville St",
"Courts": 2
}
]
}

我获取此数据的函数是:

var data;
function getData() {
if (localStorage.getItem('myData')) {
data = JSON.parse(localStorage.getItem('myData'));
} else {
$.ajax({
url: '/getMyData',
type: 'GET',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
async: false,
success: function (data) {
data = data;
showContent(data);
}
});
}
localStorage.setItem('myData', data);
}

收到数据后,我想将其传递给 showContent() 函数,该函数会将其填充到 HTML 中。但是当我执行 console.log(data); 时,我在 Chrome 控制台中看到 undefined

var tennisArray = [];     
function showContent(data) {
console.log(data);
for (var i = 0; i < data.tennis.length; i++) {
tennisArray.push(data.tennis[i]);
// Show random item from the tennis array
}
}

我的 JSFiddle 是 here .

最佳答案

检查后端的函数(getMyData)以修复导致返回 null 的原因,并调用该函数从 JavaScript 中获取随机值。

像这样:

function showContent(aa) {
for (var i = 0; i < data.tennis.length; i++) {
tennisArray.push(data.tennis[i]);
// Show random item from the tennis array
}
if(tennisArray.length > 0){
var random = getRandomInt(0, tennisArray.length - 1);
console.log(tennisArray[random]);
}
}
function getRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}

https://jsfiddle.net/60jzh5fo/3/

我已经在没有 ajax 返回的情况下测试了该函数,它可以工作,但是您需要修复后端返回的任何问题。

您可以发布有关后端的更多详细信息,我可以在此处更新我的答案。

关于javascript - 从 AJAX 请求获取 JSON 数据并使用随机项填充,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36605230/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com