Javascript 在主干视图中编写下拉菜单

我的数据返回数组中的3个对象。我在数组中循环以获取每个对象的id属性值

我想构建一个带有3个标签的选择菜单。每个选项都包含对象的id值。我不确定为什么我的选择菜单没有渲染。这是我的密码：

(function () {

  var DimensionsModel = Backbone.Model.extend({

    url: 'http://jsonstub.com/calltestdata'

  });


  var DimensionsView = Backbone.View.extend({
    el: '.js-container',

    initialize: function () {
        var that = this;
        this.listenTo(this.model,'change', this.render);
        this.model.fetch({
            beforeSend: setHeader
        });
    },

    render: function () {
        console.log('inside render');
        console.log(this.model);
        console.log( this.model.get('dimensions').length );  //returns length of 3
        console.log( this.model.get('dimensions')[0].id ); //returns the id I expect

        var menu = '<select>';
        for (var i = 0, dimensionsLength = this.model.get('dimensions').length; i < dimensionsLength; i++) {
            console.log('ID = ' + this.model.get('dimensions')[i].id);
            menu += '<options>' + this.model.get('dimensions')[i].id + '</options>';

        }

        menu += '</select>';
        $(menu).appendTo(this.$el);

        return this;
    }
  });

  var myModel = new DimensionsModel();
  var myView = new DimensionsView({model: myModel});

}());

（函数（）{
var DimensionsModel=Backbone.Model.extend({
网址：'http://jsonstub.com/calltestdata'
});
var DimensionsView=Backbone.View.extend({
el:“.js容器”，
初始化：函数（）{
var=这个；
this.listenTo（this.model，'change'，this.render）；
这个是.model.fetch({
发送前：setHeader
});
},
渲染：函数（）{
console.log（“内部渲染”）；
log（this.model）；
console.log（this.model.get（'dimensions'）.length）；//返回长度3
console.log（this.model.get（'dimensions'）[0].id）；//返回我期望的id
变量菜单=“”；
对于（var i=0，dimensionsLength=this.model.get（'dimensions'）.length；i

以下是HTML：

<div class="js-container">
</div>

---

编辑：这里有一个小问题：

如果您的API返回数组中的对象，您还应该使用

主干集合。
代码中有一个小错误：

您正在使用：

$(menu).appendTo(this.$el);

你应使用：

$('.js-container').html(menu);

我会仔细检查与视图关联的元素，因为代码的其余部分在我看来是合理的。在render方法中，$el的值是多少？当您
新建维度视图
时，DOM中是否有
.js容器
？您的
render
是否被调用？@muistooshort我在DOM中已经有了
.js容器
。我用一个HTML示例更新了这个问题。脚本也在结束标记之前加载，顺序为jquery-1.11.0、下划线-1.6.0和主干-1.1.2。谢谢你的帮助。嗯，HTML没有
元素，但是它有一个
元素：我可能昨天就应该发现了，对不起。不用担心。一些最难看到的虫子就是那些在你面前目不转睛的虫子。谢谢你的建议。我是主干网新手，对何时使用模型和何时使用集合有点困惑。你知道有什么好的推荐信吗？我已经看过很多教程，但我想它还没有点击。谢谢你的建议！有一本关于Backbone.js的非常好的免费书：谢谢你的建议，但那没有帮助。似乎标记没有写入标记之间。我还为问题添加了一个提琴。当我检查您在此处发布的提琴链接时，发现选项在select标记之间呈现。MUISTOSHORT在问题的注释中提供了答案。：）