我正在尝试使用.json文件创建一系列对象,这些对象在我们网站的多个页面上使用,然后使用Jquery中的getJSON函数将它们拉到站点上的不同页面中。我想要帮助的是根据我传递给div中的特殊属性的值,找出如何仅从我的文件中获取某些对象。 我把大部分代码都删掉了,但是我似乎错过了让它工作的东西。
这是页面中的div,我用来传递数据键,我想获取getJSON函数以及将返回的数据附加到。
<div id="moreSolutions" boxes="revcyle ev ev_for_physicians"></div>
以下是我从中提取数据的.json文件中的几个对象:
[ {
"divName":"ev",
"link":"/pages/our-solutions/t-systemev.php",
"class":"moreSolutionsDiv",
"class2":"moreSolutionsDivSubHead",
"id":"ev",
"span1":"<center><span class='h3'>EV™<br /></span></center>",
"span2":"<center>Easy, Effective, EDIS</center>"
}
}
,
{
"divName":"evForPhysiciansDiv",
"link":"/pages/our-solutions/ev_for_physicians.php",
"class":"moreSolutionsDiv",
"class2":"moreSolutionsDivSubHead",
"id":"evForPhysiciansDiv",
"span1":"<center><span class='h3'>EV™ <br />for physicians</span></center>",
"span2":"<center>Take back control of your documentation</center>"
}
]
这是我用来获取内容的jQuery:
$("document").ready(function(){
var searchField = $('#moreSolutions').attr("boxes");
var searchArray = new Array;
searchArray = searchField.split(' ');
$.getJSON('data.json', function(data) {
var output = "";
var index = 0;
$.each(data, function(key, val){
index ++;
output += "<a href='"+val.link+"'>";
output += "<div class='"+val.class+"'>";
output += val.span1;
output += "<div id='"+val.id+"'></div>";
output += "<div class='"+val.class2+"'>";
output += val.span2;
output += "</div>";
output += "</div>";
output += "</a>";
});
$("#moreSolutions").html(output);
});
});
我能够完成所有事情,包括将我的div中的属性转换为数组,但是我很难弄清楚如何循环返回的数据以获取我想要的内容。理想情况下,我的查询会询问具有“divName”值的所有键,然后返回整个数据集中的所有数据。 I.E.如果我要求键“ev”,我会找回链接,类,class2,id,span1和span2键和值。 在此先感谢您的帮助。
答案 0 :(得分:0)
underscore.js有许多用于处理对象和数组的有用函数。
获得JSON数据后,可以使用_.filter
函数来获取与真值测试匹配的对象。真实性测试是对象的divName
属性是否在您的搜索词列表中。只有匹配后,您可以使用_.each
迭代每个对象并构建输出。
$("document").ready(function(){
var searchField = $('#moreSolutions').attr("boxes");
var searchArray = searchField.split(' ');
$.getJSON('temp.json', function(data) {
var matches = _.filter(data, function(jsonObj) {
return _.contains(searchArray, jsonObj.divName);
});
var output = "";
_.each(matches, function(val) {
output += "<a href='"+val.link+"'>";
output += "<div class='"+val.class+"'>";
output += val.span1;
output += "<div id='"+val.id+"'></div>";
output += "<div class='"+val.class2+"'>";
output += val.span2;
output += "</div>";
output += "</div>";
output += "</a>";
});
$("#moreSolutions").html(output);
});
});