JQuery DOM событие не работает на Backbone View

Question

У меня есть мнение, что каждый раз, когда вызывается повторно визуализирует элементы в представлении, вот кусок кода, в:

Project.Views.CheckinScheduledView = Backbone.View.extend({ 
tagName: 'div', 
id:'CheckinScheduledView', 
className:'section', 
checkinsHtml: '', 

initialize: function() { 
    _.bindAll(this); 

    this.checkinsCollections = new Project.Collections.Checkins(); 

    this.checkinsCollections.on('reset', this.render); 
    this.checkinsCollections.fetch(); 
}, 

events: { 
    'click .scheduled_checkin a':'deleteCheckin' 
}, 

render: function() { 
    var that = this; 

    // HERE IS THE PROBLEM 
    if($('li.scheduled_checkin').length) { 
     $('li.scheduled_checkin').each(function() { 
      $(this).css('display','none').empty().remove(); 
     }); 
    } 



    if(Project.InfoWindow.length) { 
     Project.InfoWindow[0].close(); 
    } 

    _.each(this.checkinsCollections.models, function(item) { 
     that.renderLocation(item); 
    }); 

    $(this.el).html(this.template()); 
    this.renderCheckins(); 
    return this; 
}, 

refreshData: function() { 
    this.checkinsCollections.fetch(); 
} 

это случай:

1. открыта страница
2. нажмите на CheckIN (текущий код вида)
3. вернуться домой
4. вида визуализации, но добавляет ITE мс в списке

изображения

Первый раз я загрузить вид

давайте говорить, что я иду к другой точке зрения, и теперь я вернусь к этой точке зрения

и снова: (

Answer 1

Из вашего j sfiddle не работая пример HTML, в этой функции:

renderLocation: function(location) { 
    this.checkinsHtml = this.checkinsHtml+'<li class="scheduled_checkin"><a data-id="'+location.attributes.scheduleId+'" href="#/checkin/" title="Delete: '+location.attributes.description+'">'+location.attributes.title+'</a></li>'; 
} 

Я предполагаю, что вы забыли сбросить this.checkinsHtml при повторной визуализации представления.

Редактировать: Для лучшего способа вы должны отобразить html из шаблона.

Пример использования Mustache.js

var template = '{{#models}}' + 
       '<li class="scheduled_checkin">' + 
        '<a data-id="{{attributes.scheduleId}}" href="#/checkin/" title="Delete: {{attributes.description}}">{{attributes.title}}</a>' + 
       '</li>' + 
       '{{/models}}'; 
$('#scheduled_checkins .two-columns').html(Mustache.render(template, this.checkinsCollections));