Backbone学习记录(7)
事件委托
<form>
<input type="text" class="txt">
<input type="button" class="btn" value="确认">
</form>
<span class="input-data"></span>
var FormView=Backbone.View.extend({
el:'form',
events:{
"blur .txt":"showdata",
"click .btn":"click"
},
showdata:function(){
console.log(this.$el);
},
click:function(){
console.log("confirm");
}
});
var form=new FormView();
这是一个很简单的事件委托的例子,新建了一个form的视图,把文本框的blur事件和按钮的单击事件都委托在form上。
测试结果,当输入字符串后鼠标离开焦点,控制台输出的是form这个jQ对象(如果是console.log(this.el),输出的自然是DOM原生的对象),但是怎么才能让this指向
对应的目标元素呢?
=======================================
今天想到可以
showdata:function(){
console.log(event.target.value);
}
来获取目标对象上的属性,但是我每次获取属性或者设置属性都要这么麻烦么??
Backbone学习记录(7)的更多相关文章
- Backbone学习记录(6)
路由 backbone将路由规则和一个方法名绑定到一起,来控制单页的hash,以及单页的前进后退. var UserRouter = Backbone.Router.extend({ routes: ...
- Backbone学习记录(5)
数据与服务器 var User=Backbone.Model.extend({ defaults:{ name:'susan', age:18 }, url:'/user'//数据提交的路径 }); ...
- Backbone学习记录(4)
事件绑定 on()方法 调用格式:object.on(event, callback, [context])"change" — 当attributes变化时"chan ...
- Backbone学习记录(3)
创建视图 同前面创建模型和集合的方式一样,Backbone.View.extend()即可创建视图 var UserView=Backbone.View.extend(); var view1=new ...
- Backbone学习记录(2)
创建一个集合 1)new Backbone.Collection()方式 var user=new Backbone.Model({'name':'susan'}); var list=new Bac ...
- Backbone学习记录(1)
去年买的<基于MVC的javascript Web富应用开发>,拖到现在还没看完,作者介绍了三个MVC框架,Spine ,backbone和javascriptMVC.1和2在国内的流行度 ...
- Backbone 学习笔记
Backbone 是一款基于模型-视图-控制器 MVC 模式的轻量级javascript 框架 ,可以用来帮助开发人员创建单页Web应用. 借助Backbone 我们可以使用REST的方式来最小化客户 ...
- Quartz 学习记录1
原因 公司有一些批量定时任务可能需要在夜间执行,用的是quartz和spring batch两个框架.quartz是个定时任务框架,spring batch是个批处理框架. 虽然我自己的小玩意儿平时不 ...
- Java 静态内部类与非静态内部类 学习记录.
目的 为什么会有这篇文章呢,是因为我在学习各种框架的时候发现很多框架都用到了这些内部类的小技巧,虽然我平时写代码的时候基本不用,但是看别人代码的话至少要了解基本知识吧,另外到底内部类应该应用在哪些场合 ...
随机推荐
- LIS(最长上升子序列)的三种经典求法
求最长上升子序列的三种经典方案: 给定一个长度为 \(N\) 的数列,求它数值单调递增的子序列长度最大为多少.即已知有数列 \(A\) , \(A=\{A_1,A_2....A_n\}\) ,求 \( ...
- Android 返回键的处理
多网友不明确怎样在Android平台上捕获Back键的事件.Back键是手机上的后退键,一般的软件不捕获相关信息可能导致你的程序被切换到后台.而回到桌面的尴尬情况,在Android上有两种方法来获取该 ...
- 关于jquery中attr和prop的用法
在项目开发中,遇到过这个情况,做一个全选的功能,通过点击一个checkbox实现下面的checkbox全选,用attr设置的checked属性,只可以生效一次,再次点击就不起作用了,但确实触发了事件, ...
- sdut oj 1510 Contest02-4 Spiral
Contest02-4 Spiral Time Limit: 1000ms Memory limit: 65536K 有疑问?点这里^_^ 题目描述 Given an odd number n, ...
- YTU 2203: 最小节点(线性表)
2203: 最小节点(线性表) 时间限制: 1 Sec 内存限制: 128 MB 提交: 243 解决: 204 题目描述 (线性表)设有一个由正整数组成的无序(向后)单链表,编写完成下列功能的算 ...
- 合并table中某一列相邻的相同的行
合并table中某一列相邻的相同的行1. [代码]合并table中某一列相邻的相同的行 <!DOCTYPE html><html> <head> ...
- codeforces 454B. Little Pony and Sort by Shift 解题报告
题目链接:http://codeforces.com/problemset/problem/454/B 题目意思:给出一个序列你 a1, a2, ..., an. 问每次操作只能通过将最后一个数拿出来 ...
- 常用文件操作模块json,pickle、shelve和XML
一.json 和 pickle模块 用于序列化的两个模块 json,用于字符串 和 python数据类型间进行转换 pickle,用于python特有的类型 和 python的数据类型间进行转换 Js ...
- Opencv实现简易播放器
实现了在MFC中显示图片,再要显示一个视频就是轻而易举的事了,本篇介绍使用Opencv制作一个简易的播放器,实现打开文件.暂停.继续播放.再次播放和总\当前帧数显示功能. 首先还是先看一下界面效果: ...
- iOS 编程之使用Precompile Prefix Header
一:为什么Xcode6没有自动创建Precompile Prefix Header 我们在写项目的时候,大部分宏定义,头文件导入都在Precompile Prefix Header文件里面.在Xcod ...