2013-11-15 36 views
1

我想要做的是创建视图,可以移除而不删除父元素。我发现,当我在视图上直接设置el属性时,当我的.remove()它,父元素也被删除。骨干视图不呈现没有预定义的el指定

我试过用tagName创建一个视图,认为它只是弹出它到body,但事实并非如此,它似乎并没有将其插入到页面中。

什么是正确的方式来完全删除一个元素的视图而不删除实际的包含元素?

回答

2

我不确定“父元素”是否为el

var DemoView = Backbone.View.extend({ 
    el: "#container", 
    events: { 
     "click button": "removeSelf" 
    }, 
    render: function() { 
     this.$el.append("<button>remove</button>"); 
     return this; 
    }, 
    removeSelf: function() { 
     this.remove(); 
    } 
}); 
new DemoView().render(); 

,如果你按一下按钮,#container将被删除;如果你不希望#container被删除,只是没有设置el财产做,和DemoView将创建一个空div,就像这样:

var DemoView = Backbone.View.extend({ 
    events: { 
     "click button": "removeSelf" 
    }, 
    render: function() { 
     this.$el.append("<button>remove</button>"); 
     return this; 
    }, 
    removeSelf: function() { 
     this.remove(); 
    } 
}); 
var demoView = new DemoView(); 
$("#container").append(demoView.render().el); 

现在,如果你按一下按钮,demoView将被删除,但#container不会。

0

如果您不指定默认el,则必须将它们追加到后面的元素,例如view.render().$el.appendTo('body')。主体可以是指向容器元素的任何其他选择器。