Javascript 如果我有多个JSON组，则主干错误

我目前正在玩Backbone.js，在处理JSON和输出JSON时遇到了一个问题

我遇到的问题是，如果JSON文件中只有一个条目，那么我的代码运行得很好。但是，如果添加第二个或更多，代码将触发error函数

我试着检查我的JSON格式，它返回的是有效的。代码如下：

var Post = Backbone.Model.extend({
    defaults: {
        title: null,
        img: null,
        slug: null,
        excerpt: null,
        type: null
    },
});

var Posts = Backbone.Collection.extend ({
    model: Post,
    url: "/json/postCollection.json",
    parse: function(resp, xhr) {
        console.log(resp)
        return resp;
    }
});

allPosts = new Posts();

PostView = Backbone.View.extend({
    initialize: function() {
        _.bindAll(this, "render");
        this.status = new Posts( null, { view: this });
        this.status.bind("reset", this.render);
        this.getPosts();
    },
    getPosts: function() {
        this.render(this.status.fetch({ 
            success: function(data){
                return(data);
            },
            error: function(){
                console.log('Failed to load postCollection');
            }
        }));
    },
    render: function() {
        var el = $('.posts');
        this.status.each( function(model) {
            var postTemplate = model.get('type')+"Template";

            var variables = { 
                title: model.get('title'), 
                img: model.get('img'), 
                type: model.get('type'),
                excerpt: model.get('excerpt'),
                slug: model.get('slug') 
            };

            console.log(variables);

            var template = _.template( $("#"+postTemplate).html(), variables );

            el.append( template );
        });
    }
});

var post_view = new PostView();

还有我的JSON：（同样，如果我只有一个条目，那么上面的JS可以工作）

编辑（已解决）：

谢谢你，塞曼

你为我指出了正确的方向来发现问题。我用的是一个流浪汉装置和一个防箱灯箱。默认配置未设置JSON mime类型

解决方案是将SSH放到框中，并将以下行添加到my/etc/mime.types中：

application/json

在JSON文件作为纯文本传输之前。如果您想检查javascript中的mime类型，则对于存在类似问题的任何人：

var req = new XMLHttpRequest();
req.open('GET', "/json/postCollection.json", false);
req.send(null);
var headers = req.getAllResponseHeaders().toLowerCase();
alert(headers);

---

Javascript是异步的，因此当您调用return getPosts回调时，它将返回来自该闭包的数据，而不是外部函数。您需要像这样嵌套渲染调用

 PostView = Backbone.View.extend({
    initialize: function() {
         _.bindAll(this, "render");
         this.status = new Posts( null, { view: this });
         this.status.bind("reset", this.render);
         this.getPosts();
    },
    getPosts: function() {
         var self = this;
         this.status.fetch({ 
             success: function(data){
                 self.render(data);
             },
             error: function(){
                 console.log('Failed to load postCollection');
             }
         }));
    },
    render: function() {
         var el = $('.posts');
         this.status.each( function(model) {
         var postTemplate = model.get('type')+"Template";

         var variables = { 
            title: model.get('title'), 
            img: model.get('img'), 
            type: model.get('type'),
            excerpt: model.get('excerpt'),
            slug: model.get('slug') 
         };

        console.log(variables);

        var template = _.template( $("#"+postTemplate).html(), variables );

        el.append( template );
    });
}
});

---

控制台中是否有其他错误？我几乎完全复制了您的代码，对我来说效果很好…我从这行控制台.log（'Failed to load postCollection'）得到响应；-如果我尝试向error函数添加变量，它只会显示一个空对象，但看不到对象中的任何错误消息。编辑：抱歉，错误并非完全为空，它返回以下格式：d{length:0，models:Array[0]，_byId:Object，_byCid:Object，_events:Object}_byCid:Object _byId:Object _events:Object length:0 models:Array[0]proto:fy您可能想添加服务器对问题的响应，因为问题可能就在那里。谢谢dbasman！你为我指出了正确的方向来发现问题。我用的是一个流浪汉装置和一个防箱灯箱。默认配置未设置JSON mime类型。解决方案是将SSH放到框中，并在my/etc/mime.types中添加以下行：application/json json如果您的问题得到解决，您可以随时发布答案并接受它。这样，我们都知道你的问题得到了回答。

 PostView = Backbone.View.extend({
    initialize: function() {
         _.bindAll(this, "render");
         this.status = new Posts( null, { view: this });
         this.status.bind("reset", this.render);
         this.getPosts();
    },
    getPosts: function() {
         var self = this;
         this.status.fetch({ 
             success: function(data){
                 self.render(data);
             },
             error: function(){
                 console.log('Failed to load postCollection');
             }
         }));
    },
    render: function() {
         var el = $('.posts');
         this.status.each( function(model) {
         var postTemplate = model.get('type')+"Template";

         var variables = { 
            title: model.get('title'), 
            img: model.get('img'), 
            type: model.get('type'),
            excerpt: model.get('excerpt'),
            slug: model.get('slug') 
         };

        console.log(variables);

        var template = _.template( $("#"+postTemplate).html(), variables );

        el.append( template );
    });
}
});