javascript - Backbone click event being fired multiple times -
i have seen many questions this, no 1 solving problem.
i have page main div has 1 div one-image default. there button can add other divs. have event click appends other div template "remove" button. this:
image stack
<div class="image-stack"> <div class="one-image"> ... <a id="addimage">add image</a> ... </div> </div> image template
<script type="text/template" id="another-image-template"> <div class="one-image"> ... <a id="addimage">add image</a> <a id="removeimage">remove image</a> ... </div> </script> view
events: { 'click #addimage' : 'addanotherimage', 'click #removeimage' : 'removethisimage' }, addanotherimage: function(e) { var = $('#another-image-template').html(); $('.images-stack').append(another); }, removethisimage: function(e) { $(e.currenttarget).closest('.one-image').remove(); } this works fine. when click "add" button, adds new one-image div under last one; , when click "remove" button, removes div clicked. if change view , come same view (always created new in backbone), image-stack has 1 div one-image only, fine. when click "add" button, appends two one-image divs. , if repeat previous steps, appends three.
i have checked , function being called twice (and thrice , so...). don't understand why happening since remove() removing object dom , initialize view new. ideas?
you problem related not closing , unbinding views. called zombie views. calling this.remove() , this.off() should cleanup references view.
have @ following:
this.remove()- http://backbonejs.org/#view-removethis.off()- http://backbonejs.org/#events-off
and
Comments
Post a Comment