子视图主干渲染上的事件答案

【问题标题】：Events on subview backbone render子视图主干渲染上的事件
【发布时间】：2015-06-17 17:11:08
【问题描述】：

我正在尝试渲染依赖于另一个父视图的多个子视图。在子视图上创建渲染功能时，问题就来了。此子视图正确显示，但关联的事件尚未初始化且无法正常工作。

这是代码。

 onSuccess : function(data) {
            this.asignView(this.subView1, '#div1', data.data1);
            this.asignView(this.subView2, '#div2', data.data2);

        },

...........

这是子视图的代码..

 events : {
    'clickT' : 'clickT',
},

 render : function(model) {
    $(this.el).html(this.template({
        model: model
    }));
    return this;
},

clickT: function(){

}......

分配给子视图的方法是....

asignView : function(view, selector, options) {
    view.setElement(this.$(selector)).render(options);
},

那么，我该如何解决这个问题？

【问题讨论】：

您希望在单击子视图时执行 clcickT？首先，是 clcickT 错字吗？你的事件映射是直接到clickT 而不是clcickT 。
抱歉，这是一个错误类型。函数是clickT。我的代码中有正确的名称。这不是问题。谢谢'fuyushimoya'。
那么当你点击子视图时，clickT 不会被执行？
不，它对事件没有响应。

标签： javascript backbone.js views

【解决方案1】：

奇怪的是，我尝试将你的一些代码复制到 jsfiddle，它似乎可以工作，你能指出我们的代码之间的其他区别吗？

var asignView = function(view, selector, options) {
    view.setElement(this.$(selector)).render(options);
};

var SubView = Backbone.View.extend({
    template: _.template('<span>A subView with id <%= model.id %>!</span>'),
    events: {
        'click': 'clickT'
    },
    render : function(model) {
        $(this.el).html(this.template({
            model: model
        }));
        return this;
    },
    
    clickT: function() {
        alert('Clicked');
    }
});

var subView1 = new SubView()
,subView2 = new SubView();

asignView(subView1, '#div1', {id: 1});
asignView(subView2, '#div2', {id: 2});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.1/backbone-min.js"></script>
<div id="div1"></div>
<div id="div2"></div>

【讨论】：

嗨¡ 感谢您的回答。我正在寻找我们的代码之间的任何差异，但它是相等的。我尝试在子视图中使用 this.delegateEvents() 方法，但它对我不起作用……有什么想法吗？
你用chrome dev-tool检查有没有出错？
啊！将'clickT' : 'clickT' 更改为'click' : 'clickT'，这可能是问题所在。
不，这不是问题...问题与主干中的子视图和delegateEvents有关，当子视图已渲染时，子视图的#element _dom不存在，并且相关的事件无法识别，但我不知道如何解决。
但在backbonejs.org/docs/backbone.html 中，它的setElement 为您将事件绑定到输入元素。而且，如果这是另一个错字，最好将 'clickT' : 'clickT' 更改为 'click' : 'clickT'。