使用专家属性返回某些JSON对象

时间:2014-02-28 19:54:10

标签: jquery ajax json

我正在尝试使用.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键和值。 在此先感谢您的帮助。

1 个答案:

答案 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);       
    });
});