骨干事件和Twitter引导程序弹出窗口

Question

在twitter引导程序popover中插入主干渲染视图，如下所示。问题是，当插入贯穿内容选项时，该视图的主干事件不会激发。我在div中插入视图进行测试，使用$(selector).html attanceShow.render().el事件可以正常工作。提前感谢

attendance = new Attendance()
attendance.url = "#{attendanceUrl}/#{attendanceId}" 
attendance.fetch
success: ->
attendanceShow = new ExamAttendanceShow({model: attendance })
currentTarget.popover
html : true
content: ->
attendanceShow.render().el  

谨致问候，Georgi。

Answer 1

据我所知，根据你的代码和描述，你只创建了一个popover的实例，但从未显示它。我有一个实时演示，但没有使用CoffeeScript(我个人讨厌CoffeeSript)，你可以在下面和这个jsfiddle上看到代码。

data1.json

{"content": "lorem ipsum dolor sit amet"}

index.html

<div class="container">
<div class="row">
<button class="btn" data-target="popover">Popover</button>
</div>
<div class="row">&nbsp;</div>
<div class="row">
<button class="btn" data-action="change-content">Change Content</button>
</div>
</div>

main.js

var Main = Backbone.View.extend({
model: null,
item: null,
popover: false,
events: {
'click .btn[data-target]': 'button_click',
'click .btn[data-action="change-content"]': 'change_content'
},
initialize: function() {
_.bindAll(this);
this.model = new PopoverModel();
this.model.view = new PopoverContentView({model: this.model});
this.item = this.$('.btn[data-target]');
this.item.popover({
html: true,
content: this.model.view.render().el
});
},
button_click: function(event) {
if (!this.popover) {
this.model.url = 'js/data1.json';
this.model.fetch({
success: this.model_fetched
});
} else {
this.popover = false;
}
},
model_fetched: function() {
if (!this.popover) {
this.item.popover('show');
} else {
this.item.popover('hide');
}
this.popover = !this.popover;
},
change_content: function(event) {
this.model.set('content', 'Some random content... ' + parseInt(Math.random() * 10));
}
});
var PopoverModel = Backbone.Model.extend({
defaults: {
content: ''
}
});
var PopoverContentView = Backbone.View.extend({
initialize: function() {
_.bindAll(this);
this.listenTo(this.model, 'change', this.render);
},
render: function() {
this.$el.html(_.template('<%= content %>', this.model.toJSON()));
return this;
}
});

var main = new Main({
el: '.container'
});

Answer 2

我有一个类似的问题，要扩展Georgi的答案，请尝试这个：

在弹出窗口中放置一个按钮或链接(而不是您放置的动态文本)并处理事件，比如点击事件。