Javascript backbone.js-事件仅触发一次

我的活动没有如我所希望的那样有效，我想我知道原因。单击每个页面范围时，所有内容都会正确呈现。但是我意识到——也许事件没有重新附加到新的标记上？这就是为什么它只能工作一次吗？（如果我单击其中有数字10的范围，10个项目会像它应该的那样出现。但之后，我单击的任何内容都不会改变任何内容）

有什么更好的方法来组织这件事？模板是否应该不包括分页部分？在标记再次呈现后，如何将主干事件附加到标记

var ListView = Backbone.View.extend({

    initialize: function() {
        var self = this;
        this.collection.bind("refresh", function(){self.render();});
        this.render();
    },

    events: {
        'click ul#perpage span': 'setperpage'
    },

    setperpage: function(event) {
        this.collection.perpageurl = '/perpage/' + $(event.target).text();
        this.collection.fetch();
        this.collection.refresh();
    },

    render: function() {

    template = _.template('\
    <table>\
    <% _(collection).each(function(model){%>\
    <tr><td><%=model.id%></td><td><%=model.name%></td><td><%=model.email%></td></tr>\
    <%}); %>\
    </table>\
    <ul id="perpage">\
    <li><span>5</span></li>\
    <li><span>10</span></li>\
    </ul>\
    ');

        var context = {collection: this.collection.toJSON()};
        $(this.el).html(template(context));
        $('#app').html(this.el);
        return this;
    }
});

var ListView=Backbone.View.extend({
初始化：函数（）{
var self=这个；
this.collection.bind（“refresh”，function（）{self.render（）；}）；
这个。render（）；
},
活动：{
“单击ul#每页跨距”：“设置每页”
},
setperpage:函数（事件）{
this.collection.perpageurl='/perpage/'+$（event.target）.text（）；
this.collection.fetch（）；
this.collection.refresh（）；
},
render:function（）{
template=\模板（'\
\
\
\
\
\
\
5
\
10
\
\
');
var context={collection:this.collection.toJSON（）}；
$（this.el）.html（模板（上下文））；
$（'#app'）.html（this.el）；
归还这个；
}
});

试试：

---

用于在JavaScript中调试事件。它将告诉您哪些元素附加了事件。

event.target

可能会产生误导，您应该使用

event.currentTarget

，如中所述

render: function()
{
    // …

    this.delegateEvents();
    return this;
}