title: Backbone.js: Why does the event being fired multiple times
body: <p>I am very new in backbone.</p>
  
  <p>I am trying to have an event on the view object. When I add the event with alert box message, the event being called multiple times.</p>
  
  <p>This is my code i written: </p>
  
  <pre><code>var photo = Backbone.Model.extend({
  
      initialize : function () {
          imageURL = 'no url',
          data = "";
          width = 0,
          height = 0
      },
  
      close: function () {
          this.destroy();
          this.view.remove();
      }
  });  
  
  var photoCollection = Backbone.Collection.extend({
      model : photo,
      url   : '/photos'
  });
  
  var photoView = Backbone.View.extend({
      model: photo,
      el: 'body',
      initialize: function () { 
      },
      events : {
          'click img':'imageClicked'
      },
      imageClicked : function () {
          alert("ASDF");
      },
      resize: function (d, width, height) {
  
          var image = new Image();
          image.src = d;
  
          $(image).prop('src', d);
          $(image).prop('width', width + 'px');
          $(image).prop('height', height + 'px');
  
          $(this.el).append('&lt;img src="'+d+'" style="float:left; width:'+width+'px; height:'+height+'px" /&gt;');
          return this;
      }})
  </code></pre>
  
  <p>;</p>
  
  <p>The code I use to create the view instance is here</p>
  
  <pre><code>                    return collection.each(function (photo) {
                      var pView = new photoView({ el: 'body' });
  
                      pView.resize(  photo.get('data'), parseInt(width /summedRatio * photo.get('aspectRatio')), parseInt(width/summedRatio));
                  });
  </code></pre>