backbone.js events and el

Question

좋아요, 그렇기 때문에 백본보기 및 이벤트가 해고되지 않는 것과 관련된 몇 가지 다른 질문을 읽었습니다.하지만 여전히 슬프게도 안좋아하고 있습니다. 나는 백본을 약 하루 만 먹고 있었기 때문에 나는 기본적인 것을 놓치고 있다고 확신한다. , http://jsfiddle.net/siyegen/e7sNN/3/

(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); 

의 GridView에 okay 이벤트가 발생하지 않는 이벤트가 처음 바인딩 될 때 div.grid-view이 존재하지 않기 때문에 나는 있으리라 믿고있어 : 여기에 내가 함께 일하고 있어요 무엇과 jsfiddle입니다. 동적으로 뷰에 빌드 된 이벤트 바인딩 및 실행을 어떻게 처리해야합니까? (또한, 짧은 예를 들어,하지만 난 그 내가 안 아무것도하고있어 경우 나 소리 주시기)

Answer 1

귀하의 문제의 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: { 
    'click': 'okay' 
} 

(또는이 문제가 당신을 만든 얼마나 미친에 따라 경고를 읽은 후 "당신의 마음을 듣고") : 당신이 당신의 events를 변경하는 경우.

고정 바이올린 : el`는`.grid-view`와 DIV 태그가 http://jsfiddle.net/ambiguous/5dhDW/