我正在使用backbone.js创建一个web应用程序。我有两个选项卡。Tab 1是backbone.js视图,而tab2是另一个主干视图(同类)。
这两个视图被加载到页面中的同一div元素中。目前我所做的是,当用户更改选项卡时,我会使用骨干路由器进行检测。然后,路由器进行检查,查看视图是否已经存在,或者是否应该创建视图。
我创建了一个对象管理器对象,它根据键(键是选项卡名)存储视图对象。
App.ObjectManager.getContentView = function (tabId) {
return App.ObjectManager.ContentHash[tabId];
};
App.ObjectManager.setContentView = function(tabId, view) {
App.ObjectManager.ContentHash[tabId] = view;
};
App.ObjectManager.hasContentView = function(tabId) {
if(App.ObjectManager.ContentHash[tabId]==undefined) {
return 0;
}
else{
return 1;
}
};下面是我创建视图并将其存储到list对象的方法。每次单击选项卡时都会调用此代码,路由器会检测到更改。
$("#myDiv").html("");
if(App.ObjectManager.hasContentView(tabId)==0) { //View is not in the lookup table
console.log("View is not created yet. So we need to create");
content = new App.MyBackboneView(); //create a new view
App.ObjectManager.setContentView(tabId, content); //Store the view
}
else {
console.log("View is already created..So we read it and show it");
content = App.ObjectManager.getContentView(tabId);
}
//Now, we add the view to the main div
$("#myDiv").append(content.el);上面的代码通过向myDiv显示视图来工作。我可以看到文本框和单选按钮等的值。
唯一一件事--事件处理不起作用。因此,如果我在视图中有一个添加了事件处理程序的按钮,则在从保存的对象呈现视图时不会调用该事件。第一次显示视图时,单击事件正在处理。
例如,我在视图中有这个按钮“说我的名字!”
events: {
"click #say": "sayName"
},
sayName: function() {
console.log("I click say Name");
}第一次加载视图时,当我按下按钮时,console会向我显示日志。当我再次返回到选项卡时,此时视图从列表对象中显示,单击事件不起作用。
我的代码有什么问题吗?
希望你能给我一些如何存储视图的方法,我可以再次重用视图。
谢谢。
发布于 2012-08-29 19:53:17
我也有同样的问题,我有几个显示聚合数据的“标签视图”,比如“我的消息”,“所有消息”,“所有用户”等等。我将视图的对象存储在一个哈希表中,比如“视图”。
是的,就像凯恩·科恩提到的那样:
$('#myDiv').html('') or $('#myDiv').$el.empty()销毁所有绑定...对我来说起作用的是使用“分离”,因为它不破坏绑定(http://api.jquery.com/detach/),假设之前显示的内容是“所有消息”,用户点击“我的消息”:
views['All messages'].$el.detach()
$('#myDiv').append views['My messages'].el我用的是咖啡脚本...附注:希望这能有所帮助,尽管我对这种方法并不满意……
https://stackoverflow.com/questions/10647363
复制相似问题