jquery的自定义事件: bind("myEvent", customEvtHandler) , $("some").trigger("myEvent")
1, 如果在一个元素上 bind多个 事件, 如何处理?
- 多个事件可以 共用一个事件处理函数/
- 可以用 if判断 事件的类别, 然后执行不同的动作:
if (evt.type ==click ){...} ; if (evt.type == keydown) {...} - 也可以直接用 evt: handler的map形式:
$("selector").bind({ click: function(){...}, keydown: function(){... } });
2, 作为js编程, 要觉悟: 要及时的 充分的 使用js 临时变量， 来保存 缓存 jquery对象， 如：
$this = $(this);
$td = $("td", "#table");
因为： 每一次使用 $("selector") 来获得jquery对象时， 都是对整个 html dom树 进行一次 遍历, 这在js的执行 性能上 是一个大的损失...
3, 阻止事件冒泡， 有两种方法， 一是stopPropagation, 二是在事件处理函数中返回false。
4, ajax: 类型， 有：
-
type： 这个是指发送请求 和数据的方式， 值为： get 或 post；
-
dataType： 这个是指 返回的数据类型， 包括： xml， text, html, script, json , _default 这个dataType实际上是 对远端服务器上被请求的页面 而言的, 告诉被请求的页面, 你要给我 返回 "dataType" 这样的格式的内容... , 比如, dataType: 'json', 那么被请求页面就要返回一个 json形式的内容. 所以, 如果纯粹是为了测试, 可以写成 resp.json, 而实际中, 被请求的文件, 可能要 经过业务处理, 并不是简单的返回, 所以还得要用 .php文件处理后返回数据.
-
contentType： 默认的contentType是： application/x-www-form-urlencoded. 注意， 这个是content - Type, 不是dataType。是说， xhr在向服务器发送请求时， 如何对信息进行编码等 处理。。。
contents 和 context？
contents MapV1.5
一个以"{字符串:正则表达式}"配对的对象，用来确定jQuery将如何解析响应，给定其内容类型。 // 就是用contents的这种方式， 来解析返回的json数据
context？ 改变默认的回调函数中的this。
**什么是ajax: 就是异步的javascript!! **
所谓异步的/平行的, 不是串行的,不会阻塞用户的, 即当ajax请求时, 不会阻塞用户进行其他操作, 如电击按钮, 填写表单等动作...
**ajax 包括js, xml, 其核心是 通过 javascript的对象 XMLHttpRequest, 来实现 (局部的dom元素的更新, 不是全部document文档的更新): ajax的实现者是 javascript引擎, 所以它是在 客户端通过浏览器 来实现的, 也就是说, ajax的实现核心是在 客户端的js中, 不是由服务器来实现的, 服务器只是响应 http请求(如同普通的http请求一样), 所以服务器基本上消耗的 "处理资源"是很少的.... **
如何使用ajax:
一方面, 由javascript 来向url发送http请求, 不是通过document.location.href来发送请求; 并且由xmlhttprequest类型的实例(用
request或 xhr 来表示), 接受请求, 接收从服务器传回的数据.
另一方面, 当在脚本中发生 ajax异步请求时, ---(这个异步请求, 即$.ajax(), $.get(), $.post(), load()方法等, 也不是随便写的, 通常应该是写在 一个按钮 的click事件中吧, 也就是说, 通常情况下的符合常理的 操作是: 当单击某个按钮的时候, 才发送ajax请求...),--- 会触发 一些 bind到 document的 "全局事件", 包括: start, send, complete, stop, error, success等事件. 这些事件对应着事件函数. 这些全局事件 可以由 document下的任意dom元素去响应执行 对应的 事件函数, 如 $("#msg").ajaxStart(function(){....});
如何处理ajax 从服务器端返回 的数据?
-
在ajax请求方法, 如$.get, $.post等中就 处理返回的数据... $.post的function(retData){这里选择其他显示节点, 显示或处理返回的数据...)
-
不在ajax请求函数中处理返回的数据, 而是通过这些 ajax 事件函数, 来处理ajax请求返回的数据...
-
比如常见的一种使用方式是: 起初, 将ajax loading的 提示信息隐藏, 然后在ajax请求开始时, 让其在 ajaxStart的 "ajax事件" 中让其显示, 在请求结束时, 让其在 ajax事件 "ajaxStop()" 中消失:
$("#loading").ajaxStart(function(event, request, settings){
$(this).css("display", "block");
// 或者, $(this).show();
});
$("#loading").ajaxStop(function(event, request, settings){
$(this).css("display", "none");
// 或者, $(this).hide();
alert(event.type); alert(settings);...
});
ajax事件, ajax事件的函数方法只有 一个参数callback, 这个回调函数包含三个参数: event事件本身, request即ajax创建的XmlHttpRequest对象, 和ajax的设置settings...
wait a minute: minute 除了做 "分钟"讲外, 还有 adj. 微小的， 极小的, 很小的(相当于mini); 精细的 意思.
同时,当做 "极小的 "意思讲的时候, 读音通常读成: mai'nju:t
做分钟讲时, 读成: minit, (u发两种音:ｊｕ：， i）
$("#results").append( "" + $("form").serialize() + "" );
传送数据， data的形式：
- key=val&key2=val2... 这种查询字符串的形式；
- map的形式： {name: 'john', age: 20}
- map 的数组形式 { 'employee[]', ["john", "jack", "tom"] }
// 传送数组，结果必须是数组， 同时，前面的key值， 也要是一个数组定义的形式： array_name[], 由于有中括号，所以要加上引号。 参考c语言中 定义数组的形式： char* employee[] = ["john", "jack", "tom"]
// 同时也说明， 要传递的数据逻辑 不同， 采用的数据结构形式 也应该不同： 如果是描述一个对象的具体信息， 用对象map的形式， 如果是多个平行的 并列的数据形式， 采用数组的形式。
ajax中各个ajax函数中, 都有fn参数, 要注意 不同的环境中,fn中的参数是不同的:??
-
$.get, $.post方法中的参数 fn, 表示ajax请求成功后的回调函数, 里面只有一个参数data, 这个data正是服务器返回的数据. 数据的类型dataType, 由get/post的最后一个参数 type来指定;
-
ajax事件 处理函数中, ajaxStart 和 ajaxStop的callback函数中, 可能? 只有一个event参数, **但是没有xmlhttprequest-xhr参数, 和settings参数的!
-
同样是ajax事件处理函数, ajaxSend, ajaxComplete, ajaxError, ajaxSuccess这四个函数中, 回调函数fn的参数则是三个: event, xhr,settings...
注意: 又有一个常犯的 低级 错误: function函数 , 经常被误写为 funtion, functoin funcion等等, 而报错: missing ).
ajax的options [settings]的设置选项??
-
关于xhr
-
返回json格式的数据data? 如果设置为json, 返回来的就已经是 js对象了. 在jquery的内部, 就已经通过xhr, (内部调用JSON.parse()), 转换为js对象了.
-
context和 contents的区别
contents是设置一个正则表达式, 要求返回的data数据就按 contents的样式 进行解析
而context是指 $.ajax回调函数 中的$this参数, 从原来默认的 settings, 改变为context指定的 dom元素...
json 本身的类型表现形式， 有两种
json对象，
json数组： 这种数组里面， 元素应该是 json对象, 即json数组应该由 json对象组成。
json的key = value， value的类型有以下几种， 跟js的对象基本相同， 只不过没有js中的 undefined:
字符串，
数字
boolean
对象
数组
null
** tt是true type的意思, 在html中的 tt标签是指将其中的文字内容 , 显示为类似打字机, 或等宽的效果.**
5, jquery的ajax分为: ajax请求; ajax事件; ajax设置
$.ajax 请求
由$. 开头， 返回的是 XMLHttpRequest 类型的对象, 这个对象在后面的ajax事件中会被作为 request 使用,但是这个参数xhr基本上没有使用,是被丢弃的
.ajaxComplete等请求
非$. 开头的方法， 返回的 一般是jQuery对象。 所以, 应该由 jquery对象即 $("selecotr") 来调用.
blah: [bla:] adj. 无聊的,枯燥的:
are you feeling blah about your work and life?
that's just a lot of blah.
6, ajax返回json 编程例子
请求的文件(要返回内容的文件), 可以是任意 类型-扩展名 的文件, 如asp, php, 甚至如同这里的 ~.abc, 还可以指定路径,支持相对路径和根路径
关于返回的数据, 如果是text, 会按 "原样" literal返回, 哪怕有 字符串的 双引号, 连引号也会返回
7, 几个ajax事件函数的区别:
ajaxStart& ajaxStop只有在 一系列 ajax事件发生时 的 第一个事件开始时才会触发;
ajaxSend & ajaxComplete 在多个ajax请求发生时, 每一个请求都会触发 send和complete事件..
8, 关于ajax的事件顺序?
在 $.ajax方法中, 提供的方法,只能在请求过程中使用, 不是" 全局事件", 而且比 全局事件要多, 如: beforeSend等. 内部事件名称仍然采用 驼峰书写法!! "请求"内部"事件", 而且不加ajax.. :: 凡是不加ajax的 都是局部函数, 都只能在ajax请求中,即$.ajax(....)中使用, 而ajax...方法都是全局的...
**理解 这句话的意思:
是说 , 要处理由 $.ajax(...)方法自己 本身 返回的数据data, 可以而且 而且只有 这样几种 回调函数, ( 在$.ajax(函数内部可以使用的) beforesend, error, dataFilter, success, complete). 这些回调函数, 要放在 $.ajax(settings) 设置settings中, 格式: beforesend: function(...){...}, success: function(data, statusStr){...}, 这些$.ajax()中的回调函数, 只能用在 ajax()的选项中, 它们是局部, 函数内部的 回调函数.作用域 是在 $.ajax()内部. **
$.ajax(), 中的 url请求文件的http地址, , 既可以 放在 settings的外面, 作为单独的 第一个参数使用, 也可以放在 settings的内部, 整个 ajax()函数, 就只有一个参数, 即$.ajax({....}). 而且 后面这种方式 感觉使用的 更多..
ajax方法的使用, 有$.ajax(), $.get, $.post()等等, get和post是比较简单等用法, 但是 感觉在项目上, 通常使用 $.ajax, 很少使用get和post. 因为前者, 更灵活. 语义更清晰 ...
** 在任何函数内部, 包括这里的ajax函数, 同样可以使用 任何的 外部的 全局的 变量和函数..**
success和error:function(data, statusText), 其中的statusText 是指, 表示" 成功/失败的/错误 代码的字符串", 通常是success, error. 通常, 用status来表示 返回状态的数字, 用statusText来表示 返回状态的字符串...
ajax全局事件函数, ?? 绑定在 根元素 document上, 可以执行, 为什么绑定在 具体的selector元素上, 就不行?
这个绑定到document上后, 也能实现dcument子元素的处理...一样的, 不必硬是要追求绑定到 子元素上, 至于this也不必一定要去使用它!!
要查看ajax事件的先后顺序, 可以在每个事件处理中, 使用alert, 看alert弹出的先后顺序即可!
这个问题, 好像网上说, 是跟jquery的版本有关, ?!
vim 使用 更深入进阶:(进阶, 只有在熟练, 大量使用基本 操作的基础上, 为了解决效率, 或解决遇到的问题时, 你才会进阶!) 参考文章:http://www.cnblogs.com/me115/archive/2011/04/08/2009104.html
fx, 定位字母, 如果要多次呢, 反复使用fx就慢了, 在vim中, 这个叫做"motion, 跨度, 从一点到另一点 , 相当于将文本 分成很多 个部分, 所以重复 定位字母, 就用 分号;
tx, 是到定位的字母的 前面那个字母, Fx, 和Tx就跟前面的fx, tx相反了
移动光标:
移动文档内容, 用 ctrl_D , ctrl_F, ctrl_u, b, 文档内容在真的移动,
而H, M , L 是只移动光标, 文档本身 并没有移动...
查找单词: *, #, 而且是在文档 全局范围内 查找光标所在位置处的单词...
不能只是 使用 i进入插入模式, 应该 选择 最合适的方式 进入插入模式, 如: C和S 都是删除当前行, 并进入插入模式, 而s 只是删除当前字符进入插入模式, 但是 c则要 连接一个 {motion}, 才能使用: c{motion} : 删除当前字符到 跨度的字符内容, 并进入插入模式...
选择操作, 分为 可视 和非可视 操作,
采用可视操作, (所谓可视, 就是看得到, 通过选择 会出现高亮的 内容...) , 三种可视化选择: v, V, C_v, 分别显示: --visual--, --visual line-- --visual block--
可视化操作, 选择可视内容后, 就用一个 "单字符"命令 来操作了..
非可视化模式下, 也支持 跨度操作 : d{motion} , y{motion}, c{motion}
操作内容的单词,主要由几个: d, y, c(change, 跟d, y意思一样, 指是会进入insert模式), s(替换命令), 相应的d, y使用的方式, 也适合c, s,
d, y , c, s 支持 三种操作方式:
一是, 使用 跨词, 使用 跨度: 如: d{motion}, y{motion} c{motion}
二是, 使用 "双字", dd, yy, cc
三是, 使用 "大写字母"命令: D, Y, C. D 和C 是从当前光标到行尾...
vim的行合并命令: (这个很有用) ddp 交换行...
在normal模式下( normal模式是指在 非插入的常规状态下, 命令模式, 是指要 用 冒号开头的模式) , 使用 J命令, 注意这时要 大写字母J, 不能用小写j, 因为小写的j在normal模式下, 表示向下移动一行.
也可以用命令行命令: :m,n join, :m, n j
如果要保留 行前面的 空白, 使用 :m,n gj 或者 gJ, 3gJ.
**vim的命令, 可以使用数字来扩展行, 也可以用来扩展{motion}. **
在命令行模式下, 使用 :m,n j, 或者:m,n join
vim命令中的数字
命令行中的数字, 表示行的序号, 第几行, 命令行中的数字, 总是放在命令的前面, 表示操作的范围选择....
normal模式下的数字, 是对命令的操作对象的扩展, 相当于表示 操作的倍数. 对normal模式下的单字命令, 数字只能放在前面, 因为输入这个单字命令后, 命令马上就执行了. 对于多字命令, 数字即可以放在前面, 也可以放在中间, 对{motion}的倍数扩展. 数字都是从当前位置 开始算起的...
比如: 2dd = d2d, 表示删除 (包括当前行在内的) 2行内容.
撤销操作, 使用等是 u, 这个只是撤销最近一次等操作, 如果要撤销 对整行等操作, 使用 大写的 U
jquery的串方法使用, 可以在一个jquery对象上, 绑定多个 方法, 要注意 这些方法的执行顺序, 并不是由 你写的方法的 先后顺序来决定的, 不一定你写在前面, 就一定会先执行, 哪个是由事件发生的先后次序来决定调用的...
jquery的 each方法!
- 你可以直接对某个 jquery对象使用 each 方法, 如: $("img").each(function(i){...});
- 也可以直接 使用 $, jQuery调用each 方法: 如: $.each($("img"), function(i, item){....} );
ajax最后完全代码:
