把鼠标放在任务项目的上面，会在任务标题的右边，出现一个删除的按钮，点击这个按钮，可以删除掉对应的任务。实现这个功能， 需要在任务模型的模板上面添加一个按钮元素，然后去监听这个按钮元素的点击事件，发生点击事件以后，去执行模型的 destroy 方法，把模型删除掉。
在任务项目上添加删除按钮
先打开应用的主页 index.html ，然后找到定义任务模板的地方（#item-template），添加下面这行代码：
<button class="destroy"></button>
一个 button 标签，上面加上了一个叫 .destroy 的 css 类，在应用的样式表里，已经为这个类定义好了一些样式，一会儿我们也要用到这个类来定义这个元素。现在，任务的模板看起来像这样：
<!-- 任务模型的模板 -->
<script type="text/template" id="item-template">
<div class="view">
<input type="checkbox" class="toggle" <%= completed ? 'checked' : '' %>>
<label><%= title %></label>
</div>
<input class="edit" value="<%= title %>">
<button class="destroy"></button>
</script>
监听删除按钮上的点击事件
下面， 我们要去监听刚才在任务项目上添加的这个删除按钮上的点击事件，因为这个按钮属于任务视图的一部分，所以，可以在任务视图上去监听这个事件。打开 js/Views/TodoView.js ，然后在 events 属性里面，添加：
'click .destroy' : 'clear'
在 .destroy 这个类所在的元素上面发生 click 事件以后，就去执行一下 clear 这个方法，在这个视图里面，再去定义这个方法：
// 点击 删除 按钮后删除当前模型
clear: function() {
this.model.destroy();
},在这个 clear 方法里面，用到了与当前视图相关的模型的 destroy 这个方法，它可以把这个模型删除掉。删除以后会在模型上发生一个 destroy 事件，利用这个事件，可以立即去更新一下显示，把删除的模型从应用的界面上也删除掉。在视图的 initialize 方法里面，可以去监听这个 destroy 事件：
this.listenTo(this.model, 'destroy', this.remove);
这个事件是发生在了 this.model，表示与当前视图相关的那个模型，事件的类型是 destroy，发生这个事件以后去执行视图的 remove 这个方法，这个方法在 Backbone 的视图里面已经定义好了，它的作用就是把模型从界面上删除掉。
另一种将单个模型删掉的方法
双击任务标题可以编辑任务，清空任务标题的内容，然后按一下回车或离开编辑的文本框就会删除掉这条空白的任务项目。实现这个小功能，可以去编辑一下用来处理保存对任务修改的方法，在任务视图里，找到 close 方法，然后按下面这样去修改一下：
// 保存对任务的修改
// 修改以后任务标题为空就把它删除掉
close: function() {
var newTitle = this.$('.edit').val().trim();
if (newTitle) {
this.model.save({title: newTitle});
} else {
this.clear();
}
this.$el.removeClass('editing');
},在这个方法里，添加了一条 if 语句，去判断一下修改完成以后的标题是否有东西，如果有，就去保存，如果没有，就会执行 this.clear() 这个方法，把模型删除掉。
JavaScript Backbone
