我似乎无法触发事件。
这是多个视图和单个视图:
单身的:
PartyView = Backbone.View.extend({
tagName: 'span',
className: 'aParty',
senderTemplate: _.template($('#senderTemplate').html()),
recipientTemplate: _.template($('#recipientTemplate').html()),
render: function () {
if (this.model.get("isSender")=="1")
$("#senders").append(this.senderTemplate(this.model.toJSON()))
else
$("#recipients").append(this.recipientTemplate(this.model.toJSON()))
},
events: {
"click .delete":"deleteParty",
'click #recipients': "sayhi"
},
sayhi : function () { console.log ("hi"); },
deleteParty:function () {
this.model.destroy();
this.remove();
}
})
多:
PartiesView = Backbone.View.extend({
className: "partiesView",
senderTemplate: _.template($('#senderTemplate').html()),
recipientTemplate: _.template($('#recipientTemplate').html()),
render: function(eventName) {
$("#senders").empty();
$("#recipients").empty();
_.each(this.model.models, function(party){
var partyview = new PartyView ({ model: party })
partyview.render();
}, this);
return this;
},
events : {
'click #recipients': "sayhi"
},
sayhi : function () { console.log ("hi"); }
});
我没有收到控制台错误,一切都很好。我只是无法让 sayhi 或 delete 事件触发。我怀疑它与模板中丢失的事件和这个类似的事件最密切相关,但实际上我已经试图弄清楚几个小时了。任何指导将不胜感激!!
编辑1:
这是模板:
<script type='text/template' id='senderTemplate'>
<span class='greenbubble'><%= email%> <button class='delete'>x</button></span>
</script>
<script type='text/template' id='recipientTemplate'>
<span class='lightbluebubble'><%= email%> <button class='delete'>x</button></span>
</script>
编辑2:
#senders
并且#recipients
目前在 HTML
<div id='partiesView'>
Senders:<span id='senders'></span><BR>
Recipients:<span id='recipients'></span>
</div>
编辑 3:
小提琴的最终工作版本!