backbone.js घटनाओं और el

Question

ठीक है, इसलिए मैंने बैकबोन विचारों और घटनाओं के बारे में कई अन्य प्रश्न पढ़े हैं, हालांकि मुझे अभी भी दुख की बात नहीं है। मैं लगभग एक दिन के लिए बैकबोन के साथ गड़बड़ कर रहा था, इसलिए मुझे यकीन है कि मुझे कुछ बुनियादी याद आ रहा है। यहाँ है कि मैं क्या साथ काम कर रहा हूँ के साथ एक jsfiddle है: 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 मौजूद नहीं है मैं यह सोचते हैं रहा हूँ। मुझे गतिशील रूप से दृश्य पर बनाए गए किसी ईवेंट की बाध्यकारी और फायरिंग को कैसे संभालना चाहिए? (इसके अलावा, यह एक छोटी उदाहरण है, लेकिन मुझ पर चिल्लाना के लिए स्वतंत्र महसूस अगर मैं कुछ और है कि मैं नहीं करना चाहिए कर रहा हूँ)

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 को बदलते हैं:

events: { 
    'click': 'okay' 
} 

आप अपनी गायों सुनेंगे (या कैसे पागल इस समस्या को आप बना दिया है के आधार पर अलर्ट को पढ़ने के बाद "आपके मन में उन्हें सुन")।

फिक्स्ड बेला: http://jsfiddle.net/ambiguous/5dhDW/