backbone示例

$(function() {

	var AppList = Backbone.Collection.extend({

		initialize : function() {
		},
		fetch : function(data) {
			var that = this;
			data['size'] = 6;
			$.ajax({
				url : $('#query-form').prop('action'),
				data : data,
				success : function(result) {
					if (result.code == 0) {
						that.page = result.data.pageNo;
						that.pageTotal = result.data.pageTotal;
						that.recordTotal = result.data.dataTotal;
						that.reset(result.data.pageData);
					} else {
						console.error(result);
					}

				},
				error : function(result){
					console.error(result);
				}
			});
		}
	});

	var SearchModel = Backbone.Model.extend({});
	
	

	var Form = Backbone.View.extend({
		el : '#query-form',
		events : {
			'change select' : 'submit'
		},
		initialize : function() {
			this.searchModel = new SearchModel();
			this.appList = new AppList();
			this.listenTo(this.appList, 'reset',
					this.renderAppList, this.appList);
			var that = this;
			this.pagination = new TDP.Paper($('.pagination')[0], function(num){
				$('#app-list').html('');
				that.searchModel.set(that.$el.serializeObject());
				that.searchModel.set({page:num});
				that.appList.fetch(that.searchModel.toJSON());
			});
			this._renderFunc = template.compile($('#app-list-template').html());
			this.submit();
		},
		submit : function() {
			$('#app-list').html('');
			this.searchModel.set(this.$el.serializeObject());
			this.appList.fetch(this.searchModel.toJSON());
		},
		renderAppList : function(appList) {
			var html = this._renderFunc({
				apps : appList.toJSON(),
				moment : moment
			});
			$('#app-list').html(html);
			this.pagination.reset({pageTotal:appList.pageTotal, recordTotal:appList.recordTotal, currentPage:appList.page});
		},
		
	});

	new Form();
});

源码地址：http://backbonejs.org/backbone.js