html - Backbone.js: Why does the event being fired multiple times -


i new in backbone.

i trying have event on view object. when add event alert box message, event being called multiple times.

this code written:

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('<img src="'+d+'" style="float:left; width:'+width+'px; height:'+height+'px" />');         return this;     }}) 

;

the code use create view instance here

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

since calling constructor/initializing photoview every time, multiple events getting fired.

avoid initializing in each loop.

var pview = new photoview({ el: 'body' }); 

updated anwser

var photoview = backbone.view.extend({     model: photo,     el: 'img',     initialize: function () {      },     events : {         'click img':'imageclicked'     },     imageclicked : function () {         alert("asdf");     },     resize: function (d, width, height) {          var $image = this.$(el);         $image.attr('src', d);         $image.attr('width', width + 'px');         $image.attr('height', height + 'px');          $('body').append('<img src="'+d+'" style="float:left; width:'+width+'px; height:'+height+'px" />');         return this;     }}); 

Comments

Popular posts from this blog

android - Get AccessToken using signpost OAuth without opening a browser (Two legged Oauth) -

org.mockito.exceptions.misusing.InvalidUseOfMatchersException: mockito -

google shop client API returns 400 bad request error while adding an item -