backbone 之事件(events)
backbone 之事件(events)
最近用 backbone 做了一个项目,加深了对前端mvc理解。同时也很多的收获。纠正了我对阅读源码的认识。一定要应用的熟练后,了解其思想后,再去阅读源码!千万不要本末倒置。想写写自己对backbone的感悟!接下来第一步就是backbone的event。
backbone的event 是其核心。是model和view的纽带。了解event 是必要的。
举个例子:
var User = function (name) {
this .name = name;
}
User.records = [];
User.bind = function (ev, callback) {
var calls = this ._callbacks || ( this ._callbacks = {});
( this ._callbacks[ev] || ( this ._callbacks[ev] = [])).push(callback);
}
User.trigger = function (ev) {
var list, calls, i, l;
if (!(calls = this ._callbacks)) return this ;
if (!(list = this ._callbacks[ev])) return this ;
$.each(list, function (){ this .apply( this ())})
}
User.bind( 'change', function (){
alert( 'dddd' );
});
User.create = function (name){
this .records.push( new this (name));
this .trigger('change' );
}
User.create( 'liuzhang');
当我们user调用create 就会触发change事件。其实backbone events也一样的思路,比如model 改变会触发change事件。collections 添加会触发add事件。
只要继承backbone 的Events 对象,对象就拥有了on,off。trigger等能力!比如文档上
var object = {};
_.extend(object, Backbone.Events);
object.on( "alert", function (msg) {
alert( "Triggered " + msg);
});
object.trigger( "alert", "an event");
上述的obejct 就可以添加了一些事件和回调,非常方便的。你可以翻翻backbone的源码看到
_.extend(Model.prototype, Events, {});
_.extend(Collection.prototype, Events, {})
_.extend(View.prototype, Events, {});
model,view ,collection 都继承了events
backbone内置事件写的很优雅。实现很强大的功能!ok就写到此吧
随笔- 40 文章- 0 评论- 9
Web-JS整理
这几天整理了一下自己之前用asp.net开发的网站,弄出一些js特效代码,来记录一下,分享给大家。代码例子会在后面分享。
1.相册(ShowImages)
很多人在建站的时候都会遇到构建用户相册的需求,而我之前练手时也去网上刀了别人的一个js代码(js实在是不会写,只会改)。
下面是效果图:
解释一下各个页面的关系:
ShowImages.aspx:用户相册页面
Images.aspx:用户加载图片页面。
整个例子的实现思路是这样的:ShowImages.aspx是js代码所在页面,用来构建用户相册。而在js里每个img的src其实是Images.aspx页面所加载的内容。Images.aspx页面则根据相片的id来绑定图片。
在ShowImages.aspx的后台代码里要修改好相片的起始id和末尾id
View Code
public partial class ShowImages : System.Web.UI.Page
{
protected void Page_Load( object sender, EventArgs e)
{
int i = 1 ;
int j = 4 ;
first.Value = " 1 " ; // 用户相册的相片起始id
iPicNum.Value = Convert.ToString((i > j) ? i + j - 1 : j); // 用户相册的相片末尾id
}
}
这里为了图方便,直接赋值id。
2.评分JS
效果图:
这个也是很简单的js。。。不过也是从网上刀的,我修改了一下。通过一个form表单和sumbit按钮使得可以提交评分和评语
代码例子下载: http://dl.vmall测试数据/c0blknwk6g
后知后觉 后来居上
分类: backbone
作者: Leo_wl
出处: http://HdhCmsTestcnblogs测试数据/Leo_wl/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
版权信息查看更多关于backbone 之事件(events)的详细内容...