取消注册骨干事件

我处于一个真正的骨干瓶颈。我是新手，很抱歉，如果我的questios是愚蠢的，因为我可能没有得到系统的结构点。取消注册骨干事件

基本上，我创建的广告应用程序可以让你为不同的“步骤”做一些事情。因此，我实施了某种分页系统。每当页面显示特定条件时，显示下一页面链接，并且当前页面被缓存。

每个页面使用相同的“页面”对象模型/视图，并且导航每次都附加到那里。它只是一次性注册，而且当旧页面淡出并且新页面淡入时，我将取消选中/重新分配事件。

如果我总是对先前页面使用缓存版本，则一切正常。但是，如果我重新渲染已经渲染的页面，当我点击“下一页”时，它会跳过多少次我重新渲染页面本身。

就好像“go next page”按钮已被注册了3次，并且从未从事件监听器中删除。

这是一个非常长的应用程序代码，我希望你能理解basica的想法，并给我一些提示，而不需要在这里有完整的代码。

在此先感谢，希望有人能帮助我，因为我处于真正的瓶颈之中！

p.s.出于某种原因，我注意到，下一个/上一个按钮相应的html没有被缓存在页面中。奇怪的。

--- UPDATE ---- 我试过stopListening建议，但它没有奏效。这里是jmy麻烦的按钮：

// Register the next button 
    App.Views.NavNext = Backbone.View.extend({ 

     el: $('#nav-next'), 

     initialize: function() { 
      vent.on('showNext', function() { 
       this.$el.fadeIn(); 
      }, this) 
     }, 

     events: { 
      'click': 'checkConditions' 
     }, 

     checkConditions: function() { 
      //TODO this is running 2 times too! 
      console.log('checking conditions'); 
      if (current_step == 1) 
       this.go_next_step(); 
      vent.trigger('checkConditions', current_step); // will trigger cart conditions too 

     }, 

     go_next_step: function() { 

      if(typeof(mainView.stepView) != 'undefined') 
      { 
       mainView.stepView.unregisterNavigation();    
      } 

      mainView.$el.fadeOut('normal', function(){ 
       $(this).html(''); 
       current_step++; 
       mainView.renderStep(current_step); 
      }); //fadeout and empty, then refill 

     } 
    });

基本上，checkConditions运行2次就好像previousle呈现的点击仍然是注册的。这里是它是被注册，然后注销的当前步骤淡出后关闭（只是图的一部分！）：

 render: function() { 
      var step = this; 

      //print the title for this step 

      this.$el.attr('id', 'step_' + current_step); 
      this.$el.html('<h3>'+this.model.get('description')+'</h3>'); 
      // switch display based on the step number, will load all necessary data 

      // this.navPrev = new App.Views.NavPrev(); 
      // this.navNext = new App.Views.NavNext(); 


      this.$el.addClass('grid_7 omega'); 

      // add cart (only if not already there) 
      if (!mainView.cart) 
      { 
       mainView.cart = new App.Models.Cart; 
       mainView.cartView = new App.Views.Cart({model: mainView.cart}) 
       mainView.$el.before(mainView.cartView.render().$el)         
      } 

      switch (this.model.get('n')) 
      { 

       case 5: // Product list, fetch and display based on the provious options 

        // _.each(mainView.step_values, function(option){ 
        // console.log(option) 
        // }, this); 

        var products = new App.Collections.Products; 
        products.fetch({data:mainView.step_values, type:'POST'}).complete(function() { 
         if (products.length == 0) 
         { 
          step.$el.append('<p>'+errorMsgs['noprod']+'</p>') 

         } 
         else { 
          step.contentView = new App.Views.Products({collection: products}); 
          step.$el.append(step.contentView.render().$el); 

         } 
         step.appendNavigation(); 

        }); 


       break; 


      } 
      //console.log(this.el) 
      return this; 
     }, 

     appendNavigation: function(back) { 
      if(current_step != 2) 
       this.$el.append(navPrev.$el.show()); 
      else this.$el.append(navPrev.$el.hide()); 

      this.$el.append(navNext.$el.hide()); 
      if(back) navNext.$el.show(); 

      navPrev.delegateEvents(); // re-assign all events 
      navNext.delegateEvents(); 
     }, 

     unregisterNavigation: function() { 
      navNext.stopListening(); // re-assign all events    
     }

最后，这里是主视图的renderStep，按“下一步”之后叫如果存在将加载缓存版本，但麻烦页，我没有创造它

renderStep : function(i, previous) { // i will be the current step number 
      if(i == 1) 
       return this; 
      if(this.cached_step[i] && previous) // TODO do not render if going back 
      { // we have this step already cached 

       this.stepView = this.cached_step[i]; 
       console.log('ciao'+current_step) 

       this.stepView.appendNavigation(true); 
       if (current_step == 3) 
       { 

        _.each(this.stepView.contentView.productViews, function(pview){ 
         pview.delegateEvents(); //rebind all product clicks 
        }) 
       } 

       this.$el.html(this.stepView.$el).fadeIn(); 

      } else { 

       var step = new App.Models.Step({description: steps[i-1], n: i}); 
       this.stepView = new App.Views.Step({model: step}) 
       this.$el.html(this.stepView.render().$el).fadeIn(); // refill the content with a new step 
       mainView.cached_step[current_step] = mainView.stepView; // was in go_next_step, TODO check appendnavigation, then re-render go next step 

      } 


      return this; 
     }

来源

2013-02-27 NemoPS