1 
var MyRouter = Backbone.Router.extend({
   router : {
         'something'    : 'method1',
         'anotherthing' : 'method2'

   },

   method1 : function () {
         if (!this.someView)
               this.someView.close()

         this.someView = new SomeView();
         $('someElement').append(this.someView.render().el);
   },

   method2 : function() {
     //do something
  }

});

var SomeView= Backbone.View.extend({

    initialize : function() {
        $(window).on('resize',_bind(this.onResize, this));
    },

    onResize : function() {
        alert('resized');
    },

     close : function() {
         this.remove();
         this.off();
         this.undelegateEvents();
     }

});

以上是我的代码示例。每当路由器渲染一个视图时，它都会解除绑定到现有视图的所有事件，以便它会释放并创建一个新视图。由于我已将 onResize 事件附加到窗口，因此对于 someView 的每个实例（从 #something 导航到 #anotherthing 并返回到 #something，这将取消绑定现有 this.someView 中的所有事件，并创建一个新的 this.someView 实例），它会将一个事件绑定到窗口，并且 onResize 方法会被多次触发，即使当前视图不在显示中（即我的路由器可能会显示在方法 2 中定义的一些其他视图）。我理解为什么它会被多次触发，但想知道是否有办法在骨干网或 jQuery 中处理这个问题，而不是将事件绑定到窗口的调整大小事件？

PS 我没有使用 jQuery.mobile，也不想使用任何额外的 javascript 插件，因为它会增加移动浏览器的负载。

4

1 回答 1

0

只需将 Jquery unbind (off) 添加到关闭功能时调整窗口大小：

initialize : function() {
    _.bindAll(this, "onResize");// revent the need to use _.bind
    $(window).on('resize',this.onResize);
},   
close : function() {
     $(window).off('resize', this.onResize);
     this.remove();
     this.off();
     this.undelegateEvents();
 }
于 2013-12-22T16:17:57.853 回答