在骨干中,视图控制正在发生的所有事件“在HTML代码的这一部分”(换句话说,您的关联模板)。这对于解耦代码非常有利,并且可以为一个非常好的代码结构而制作,但在尝试控制弹出窗口时可能是头痛。

骨干声中的事件使用jQuery委托自动处理,事物是,委派所有事件的DOM元素需要在视图之外或在生成视图时声明。这是模态的问题,因为我们尝试委派的元素不是视图,并且需要在渲染上被jQuery UI调用。

幸运的是,您可以在您的视图内容渲染后可以做的事情正在将此提示更改为View容器并调用this.delegatevents(this.events)。这将负责事件约束力问题。

例子

wedapp.view.TasksForm = Backbone.View.extend({
	events: {
		"click #completedbtn" : 	"complete",
		"click #updatebtn" : 		"update",
		"click #savebtn" : 		"save",
		"click #closebtn" : 		"close",
	},
	render: function() {
		var formString = this.template(this.model.toJSON());
		$(formString).dialog({
			autoOpen: true,
			height: 460,
			width: 350,
			title:"Tasks",
			modal: true
		})
		this.el = $(".dialogForm");
		this.delegateEvents(this.events)
		return this;
	},
	initialize : function(){
		_.bindAll(this,"render")
		this.template = _.template($("#task_form_tpl").html());
		this.render().el;
	},
	complete: function(){
		console.log("test")
	},
	update: function(){
		console.log("test")
	},
	save: function(){
		console.log("test")
	},
	close: function(){
		console.log("test")
	},
});

“Voila!”

这应该有助于你的弹出窗口!