backbone.js事件和el

好吧，所以我已經閱讀了關於Backbone視圖和事件沒有被解僱的其他幾個問題，但是我仍然沒有感到難過。我一直在干擾骨幹大約一天，所以我敢肯定我錯過了一些基本的東西。下面是什麼我正在使用一個的jsfiddle： http://jsfiddle.net/siyegen/e7sNN/3/backbone.js事件和el

(function($) { 

    var GridView = Backbone.View.extend({ 
     tagName: 'div', 
     className: 'grid-view', 
     initialize: function() { 
      _.bindAll(this, 'render', 'okay'); 
     }, 
     events: { 
      'click .grid-view': 'okay' 
     }, 
     okay: function() { 
      alert('moo'); 
     }, 
     render: function() { 
      $(this.el).text('Some Cow'); 
      return this; 
     } 
    }); 

    var AppView = Backbone.View.extend({ 
     el: $('body'), 
     initialize: function() { 
      _.bindAll(this, 'render', 'buildGrid'); 
      this.render(); 
     }, 
     events: { 
      'click button#buildGrid': 'buildGrid' 
     }, 
     render: function() { 
      $(this.el).append($('<div>').addClass('gridApp')); 
      $(this.el).append('<button id="buildGrid">Build</button>'); 
     }, 
     buildGrid: function() { 
      var gridView = new GridView(); 
      this.$('.gridApp').html(gridView.render().el); 
     } 

    }); 

    var appView = new AppView(); 

})(jQuery);

的okay事件在GridView上不火，我假設，因爲div.grid-view當第一次綁定事件不存在。我應該如何動態地處理視圖上建立的事件的綁定和觸發？（此外，這是一個簡單的例子，但如果我做其他事情，我不應該感到自由對我大喊大叫）

來源

2011-09-25 siyegen

因爲'el'是'.grid-view' div標籤。並且您正在該div中找到'.grid-view'類名稱元素。你不會得到它。 – Mahi

你的問題是，GridView控件的事件：

events: { 
    'click .grid-view': 'okay' 
}

說：

當你點擊一個後代匹配'.grid-view'，叫okay

個事件綁定這個snippet from backbone.js：

if (selector === '') { 
    this.$el.on(eventName, method); 
} else { 
    this.$el.on(eventName, selector, method); 
}

所以.grid-view元件必須被包含在你的GridView的this.el和你this.el是<div class="grid-view">。如果你改變你的events這樣：

events: { 
    'click': 'okay' 
}

你會聽到您的奶牛（或取決於這個問題是如何瘋狂讓你看完後警報「聽到他們在你的心中」）。

固定小提琴：http://jsfiddle.net/ambiguous/5dhDW/

來源

2011-09-25 00:46:26

工作，謝謝。一般來說，如果我想將事件綁定到視圖本身正在創建的元素上，我會省略選擇器？我測試了它，並且與另一種觀點一起工作，只是確保這是正確的方式去處理事情。 – siyegen

@siyegen：對。看看我包含的'backbone.js'代碼片段的第一個分支;如果沒有選擇器，那麼使用'$（this.el）.bind（eventName，method）;'將事件直接綁定到'this.el';如果有選擇器，則事件與'delegate'綁定。 –

但是當我想只在'this.el'有'grid-view'類時才觸發事件？ – Jashwant

backbone.js事件和el

回答

相關問題