如何编写下面的成功回调函数,以便能够访问下面返回的JSON中的对象。显然,我将无法再使用success: function(data) {if (data.returned === true) {
来访问返回的对象。我该如何做到这一点?
jQuery代码:
$("#projects").click(function() {
jQuery.ajax({ type: "POST", dataType: "JSON",
url: "<?=base_url()?>index.php/home/projectsSlider",
json: {returned: true}, success: function(data) {
if (data.returned === true) {
$("#resultProjects").html(JSON.stringify(data.Projects));
$("#resultScreenshots").html(JSON.stringify(data.Screenshots));
$("#content").fadeOut(150, function() {
$(this).replaceWith(projectsSlider(data.projectId, data.projectName, data.startDate, data.finishedDate, data.projectDesc, data.createdFor, data.contributors, data.screenshotURI, data.websiteURL), function() {
$(this).fadeIn(150);
});
});
}
}
});
});
返回JSON:
{
"Projects": [
{
"projectId": "932713684f9073189ec7b",
"projectName": "Cloud859Collective",
"startDate": "April 19th, 2012",
"finishedDate": "April 25th, 2012",
"createdFor": "ClasskCreations",
"contributors": "Mike Grigsby",
"projectDesc": "This website was created with a friend in mind. His name is Kevin Johnson and he is a rapper. He needed a website that would allow him to host and share his music."
},
{
"projectId": "10599012654f907093714e9",
"projectName": "Nurbell Studio",
"startDate": "April 15th, 2012",
"finishedDate": "April 19th, 2012",
"createdFor": "Nurbell LLC",
"contributors": "Mike Grigsby",
"projectDesc": "This is the page you are currently looking at. This is the official Nurbell homepage. Complete with a frontend and a backend."
}
],
"Screenshots": [
{
"screenshotURI": "http://nurbell.com/vd/1.0/images/project-data/kevo.png"
},
{
"screenshotURI": "http://nurbell.com/vd/1.0/images/project-data/nurbell.png"
}
]
}
答案 0 :(得分:2)
我不确定你在这里问什么。我想你应该看一下javascript命名空间。这样,您可以在对象(或命名空间)中创建属性,并将json结果放在该属性中。
类似的东西:
var myProjects = {
projects: null,
getProjects: function() {
// do the ajax thing with something like
myProjects.projects = data.projects;
},
placeProjects: function() {
if (myProjects.projects == null) myProjects.getProjects();
$.each(myProjects.projects, function(i,e){
//place project content
}
},
}
// define the click event
$("#projects").click(myProjects.placeProjects());
数据将被存储,直到您删除它或重新加载页面。您可以在firebug中的DOM检查器中看到此对象。希望有所帮助
编辑:
我在这个jsFiddle http://jsfiddle.net/BTbJu/5中实现了这个想法 运行它,单击Div中的文本以加载第一个项目。继续点击旋转。
答案 1 :(得分:0)
我不确定我是否正确理解了这个问题,但您似乎担心在调用JSON.stringify时,您的原始json可能会被永久修改。
不,JSON.Stringify将返回一个新字符串。由闭包参数'data'引用的原始json将保持不变。您将通过数据引用很好地访问所有属性。
实际上,data.projectId在闭包范围内是错误的,应该评估为undefined。
试试这个:
$("#projects").click(function () {
jQuery.ajax({
type: "POST",
dataType: "JSON",
url: "<?=base_url()?>index.php/home/projectsSlider",
success: function (data) {
var projects = data.Projects; //array
var screenshots = data.Screenshots; //array
//direct, one-off indexed
console.log(projects[0].projectId);
console.log(data.Projects[0].projectId);
//looped with map
projects.map(function(project, index) {
console.log(project.projectId);
});
//traditional for
for(var i1 = 0; i1 < projects.length; i1++) {
console.log(projects[i1]);
}
//direct, one-off indexed
console.log(screenshots[0].screenshotURI);
console.log(data.Screenshots[0].screenshotURI);
//looped
screenshots.map(function(screenshot, index) {
console.log(screenshot.screenshotURI);
});
if (data.returned === true) {
//your stringify code etc.
}
}
});
});