Question

我有这个骨干应用程序，其中一个新的视图由click事件触发并附加到DOM的主体，作为弹出窗口。我的问题是，当我在View外部点击时，我想要完全删除新的View。以下是触发新视图的事件：

view1.js：

events: {
    'click .btn': 'popupView'
},
popupView: function(){
  new popup.View().render();
}

然后代码到我的“弹出窗口”视图：

popup.View = Backbone.View.extend({
    template: 'some_template',  
    initialize: function(){
        this.$el.appendTo("body");
        this.render();
    },

    afterRender: function(){
        $("body").click(function(){
            $('div.wrap').remove(); // removes the wrap div from the html template
            this.remove() // does not work
    })

})

问题是，在弹出视图渲染后我立即点击主体，它会从DOM中删除包装div html，但是当我再次打开弹出视图时，先前的HTML会被渲染两次等等。因此，这表明，视图尚未被删除/销毁。

有任何建议如何解决这个问题？谢谢......

Answer 1

那是因为this上下文在回调函数中是不同的。试试这个：

afterRender: function(){
    var that = this;
    $("body").click(function(){
        $('div.wrap').remove();
        that.remove(); // should work
})

让我知道这是否有效

如何删除/销毁附加到正文的Backbone View

1 个答案: