Backbone.View“el”混淆
应如何处理视图？ 它必须被设置，否则事件不会被触发（见这里 ）。
但是，它应该是一个已经在网页上的元素？ 在我的应用程序中，我将一个（jQuery模板）模板渲染到Fancybox中。 在这种情况下， el应该是什么？
意见el是所有事件绑定发生的地方。 你不必使用它，但如果你想骨干火灾事件，你需要做你的渲染工作。 视图el是一个DOM元素，但不一定是预先存在的元素。 如果你不从当前页面中取出一个，它将被创build，但是如果你想看到它做任何事情，你将不得不把它插入到页面中。
举个例子：我有一个创build单个项目的视图
window.ItemView = Backbone.View.extend({ tagName: "li", //this defaults to div if you don't declare it. template: _.template("<p><%= someModelKey %></p>"), events: { //this event will be attached to the model elements in //the el of every view inserted by AppView below "click": "someFunctionThatDoesSomething" }, initialize: function () { _.bindAll(this, "render"); this.render(); }, render: function () { this.el.innerHTML = this.template(this.model.toJSON()); return this; } }); window.AppView = Backbone.View.extend({ el: $("#someElementID"), //Here we actually grab a pre-existing element initialize: function () { _.bindAll(this, "render"); this.render(new myModel()); }, render: function (item) { var view = new ItemView({ model: item }); this.el.append(view.render().el); } });
第一个视图只是创build列表项目，第二个视图实际上将它们放在页面上。 我认为这与backbone.js站点的ToDo示例中发生的情况非常相似。 我认为约定是让你的内容进入el。 所以el可以作为登陆的地方或放置模板内容的容器。 Backbone然后将其事件绑定到其中的模型数据。
当你创build一个视图时，你可以使用el: ， tagName: ， className:和id:来以四种方式操作el: 。 如果这些都没有声明为默认为没有ID或类的div。 这个页面也没有关联。 你可以通过使用tagName（比如tagName: "li" ，会给你一个<li></li> ）来改变标签的内容。 你可以设置el的id和class。 仍然el不是你的页面的一部分。 el属性允许您对el对象进行非常精细的纹理操作。 大多数情况下，我使用el: $("someElementInThePage") ，它实际上将您在视图中执行的所有操作绑定到当前页面。 否则，如果您想要查看在视图中显示的所有艰苦工作，则需要在视图中的其他位置插入/附加它（可能在渲染中）。 我喜欢把el看作是所有视图操作的容器。
现在有点老了，但我也很困惑，所以对于其他人来说，这个小提琴可能会帮助 – http://jsfiddle.net/hRndn/2/
var MyView = Backbone.View.extend({ events: { "click .btn" : "sayHello", }, sayHello : function() { alert("Hello"); }, render : function() { this.$el.html("<input type='button' class='btn' value='Say Hello'></input>"); } }); $(function() { myView = new MyView({el:"#parent_id"}); myView.render(); });
你希望你的'el'引用一个包含一个子元素的元素，该元素有任何事件触发你的视图中的变化。 可能与“身体”标签一样宽。
