从零开始学backbone.js(1)
我学javascript时间不长，jquery都只是看过，基本没用过，现在开始学backbone.js,基本可以说是从零开始。
找到backbone.js的例子，却看不懂，不知如何下手。
从backbone.js的文档入手可能不错，有兴趣的同学和我一起来学习吧。
第一个例子,自定义事件：
<html>
<head>
<meta charset="gbk" />
<script src="underscore.js"></script>
<script src="backbone.js"></script>
</head>
<body>
hello,html
<script type="text/javascript">
document.write("Hello javascript!")
var object = {};
_.extend(object, Backbone.Events);
object.on("alert", function(msg) {
alert("hello " + msg);
});
object.trigger("alert", "event trigger");
</script>
</body>
</html>
第二个例子，多个事件,一个处理函数：
<html>
<head>
<meta charset="gbk" />
<script src="underscore.js"></script>
<script src="backbone.js"></script>
</head>
<body>
hello,html
<script type="text/javascript">
document.write("Hello javascript!")
var object = {};
_.extend(object, Backbone.Events);
object.on("alert", function(msg) {
alert("hello " + msg);
});
//多个事件,一个处理函数
object.on("event2 event3", function(msg) {
alert("event2,event3 handler:" + msg);
});
object.trigger("event3", "event trigger");
</script>
</body>
</html>
第三个例子，响应全部事件和事件传递：
<html>
<head>
<meta charset="gbk" />
<script src="underscore.js"></script>
<script src="backbone.js"></script>
</head>
<body>
hello,html
<script type="text/javascript">
document.write("Hello javascript!")
var object1 = {};
_.extend(object1, Backbone.Events);
object1.on("alert", function(msg) {
console.log("object1: hello " + msg);
});
var object2={};
_.extend(object2, Backbone.Events);
object2.on("alert", function(msg) {
console.log("object2:hello " + msg);
});
//响应全部事件(事件代理，将事件传递到其他对象)
object1.on("all", function(msg) {
console.log("all events handler:" + msg);
object2.trigger(msg);
});
object1.trigger("alert", "event trigger");
</script>
</body>
</html>
第四个例子,注销事件:
<html>
<head>
<meta charset="gbk" />
<script src="underscore.js"></script>
<script src="backbone.js"></script>
</head>
<body>
hello,html
<script type="text/javascript">
document.write("Hello javascript!")
var object = {};
_.extend(object, Backbone.Events);
function onAlert(msg){
alert("hello " + msg);
}
object.on("alert",onAlert);
object.off("alert", onAlert);//注销事件
object.trigger("alert", "event trigger");
</script>
</body>
</html>