jquery day3

22、$(document).ready(fn)与$(window).load(fn)的区别

$(document).ready(fn)发生在“网页本身的html”载入后就触发，$(window).load(fn)则会等到“网页html标签中引用的图档、内嵌物件（如flash）、iframe”等东西都载入后才会触发。一般来说，等网页全部元素都载入才执行程式时机有点晚，因为在此之前，使用者已经可以点选操作网页，跳脱我们程式的掌控范围。因此，我们几乎都是将程式放 在$(document).read(function(){...})中(即$(function(){...}))。而$(window).load(fn)适合执行一些要等待图档或元素全部载入才可进行的动作，例如：检查图档长宽。只有当在这个元素完全加载完之前绑定load的处理函数,才会在他加载完后触发。如果之后再绑定就永远不会触发了。所以不要在$(document).ready()里绑定load事件，因为jquery会在所有dom加载完成后再绑定load事件。(ps:此处为查找所得)

23、鼠标

click  单击对象(按下松开)

dblclick  双击对象

mousedown 在对象上按下时

mouseup  按下,在对象上松开时

mousemove 鼠标在对象上移动时

mouseover 鼠标指针穿过被选元素区域触发,穿过其子元素区域也触发

mouseout 鼠标指针离开被选元素或者子元素区域

mouseenter 鼠标指针穿过被选元素区域

mouseleave 鼠标指针离开被选元素区域

24、键盘：焦点在哪里哪个控件的键盘事件才触发

keypress  键盘按键被按下并松开。

keydown 键盘按键被按下。      

keyup        键盘按键被松开。

25、表单

focus节点获得焦点后触发

blur节点失去焦点后触发

focusin将要获得焦点时触发，发生在focus事件之前

focusout将要失去焦点时触发，发生在blur事件之前

change内容改变时

//input    

reset 表单重置时

submit 表单提交时

 

加载(图片文档等)

load 完成加载  

abort加载被中断

error       加载发生错误

26、悬浮

hover//注:hover(fn1,fn2)  hover事件要求有两个回调函数,分别是移入和移除,只写一个回调函数时,两个状态都触发同一个函数

27、事件对象

altKey 鼠标事件发生时，是否按下alt键,返回一个布尔

ctrlKey 鼠标事件发生时，是否按下ctrl键,返回一个布尔

metaKey  鼠标事件发生时，是否按下windows/commond键,返回一个布尔

shiftKey 鼠标事件发生时，是否按下shift键,返回一个布尔

clientX，clientY返回鼠标位置相对于浏览器窗口左上角的坐标，单位为像素

screenX，screenY返回鼠标位置相对于屏幕左上角的坐标，单位为像素

键盘

altKey，ctrlKey，metaKey，shiftKey返回一个布尔值，表示是否按下对应的键

key属性返回一个字符串，表示按下的键名。如果同时按下一个控制键和一个符号键，则返回符号键的键名。比如，按下Ctrl+a，则返回a。如果无法识别键名，则返回字符串Unidentified

 28、绑定事件

jq(“button”).click(fn).mouseenter(fn).mouseleave(fn)

jq(“button”).bind(“click  mouseenter mouseleave”,fn)//多事件用空格隔开

jq(“button”).bind({“click”:fn,”mouseenter ”:fm,”mouseleave”:fo})//不同的事件想触发不同的方法,传一个对象进去

jq(“button”).one(“click”,fn)//触发一次one

多元素绑定事件：

jq(“li”).bind(“click”,function(){alert(jq(this).html())})

jq(“ul”).delegate(“li”,”click”,function(){alert(jq(this).html())})//代理//只给ul(一定要绑父亲)绑定了事件(冒泡)

jq(“ul”).on(“click”,”li”,function(){alert(jq(this).html())})

//ul 是on方法第二个参数li的爸爸,on第一个参数是事件,第二个参数是选择器,第三个参数是回调,回调里面的this关键字是个指针,指向触发click事件的对象.

事件解绑：

对应的unbind   undelegate      off

例子:jq(“ul”).on(“click  mouseenter”,”li”,function(){alert(jq(this).html())})

     jq(“ul”).off(“click”)

现象:鼠标移入触发,点击却不触发

29、事件触发

事件的触发有两种方式

1.真事件触发:真的用鼠标点了

2.假事件触发:用代码让事件触发(2种方式):

①事件名调用时不传参数(不传回调函数):$(‘#div’).click()

②$(‘#div’).trigger(‘click’)

30、动画

hide(sd,fn)隐藏元素

show(sd,fn)显示元素

toggle(sd,fn)隐藏显示开关(来回掉用)

fadeIn(sd,fn)//淡入已经隐藏的元素

fadeOut(sd,fn)//淡出已经显示的元素

fadeToggle(sd,fn)//淡出入开关

fadeTo(sd,alpha,fn)//自定义透明度

slideUp(sd,fn)//向上滑动隐藏

slideDown(sd,fn)//向下滑动显示

slideToggle(sd,fn)//上下滑动隐藏显示开关

自定义：

jq("button").click(function(){

             jq(".div").animate({ width:'200px'});//队列1

             jq(".div").animate({ width:'2000px'});//队列2

             jq(".div").animate({ width:'200px'});//队列3

            })

停止属性改变：

jq(".div").stop(bool,bool)//停止动态改变属性的现象:比如动画 滑动(参数:都可选布尔值,第一个是否停止所有队列,第二个是否立即执行完所有效果)