jQuery中的事件与动画
jQuery中的事件与动画
1、window.onload方法和$(document).ready()方法区别：
a、window.onload:在网页中所有的元素（包括元素所有的关联文件）完全加载到浏览器后才执行，即javascript此时才可以访问网页中的任何元素
b、$(document).ready():通过$(document).ready处理，DOM完全就绪后可以被任意调用
2、Bind()的调用格式：Bind( type [,data] , fn);
a、type：事件类型，类型包括：blur、focus 、load 、resize 、scroll 、unloand 、click 、dblclick 、mousedown 、mouseup 、mousemove 、mouseover 、mouseout 、mouseenter 、mouseleave 、change 、select 、submit 、keydown 、keypress 、keyup 和error等，也可以是自定义名称
b、date:可选参数，作为event.data属性值传递给事件对象的额外数据对象
c、是用来绑定的处理函数
3、jQuery中的合成方法：Hover() 和 toggle()
4、冒泡：在页面上有多个事件，也可以有多个元素响应同一个事件。
5、Hover()方法：模拟光标悬停事件。也就是当光标移动到元素上时，会触发指定的第一个函数（enter）；移除时触发第二个函数（leave）。
$(function(){ $("#panel h5.head").hover(function(){ $(this).next("div.content").show(); },function(){ $(this).next("div.content").hide(); }); });
6、toggle(fn1,fn2,fn3……fnN)：模拟鼠标连续单击事件，第一次单击触发函数fn1，第二次fn2…….
$(funcion){ $("#panel h5.head").toggle(function(){ $(this).addclass("highlight").show(); },function(){ $(this).remove("highlight"); $(this).next("div.content").hide(); }); });
7、事件冒泡：
a、在程序中使用对象非常简单，只需要为函数添加一个参数
$(“element”).bind(“click”,function(event){
//event:事件对象
b、停止事件冒泡是为了阻止事件中的其他对象的事件处理函数被执行
$("span").bind("click", function(even) { var txt = $('#msg').html() ; $('#msg').html(txt); even.stopPropagation();//停止 });
c、阻止默认行为：事件对象.preventDefault();或 return false;
d、事件捕获：事件捕获和事件冒泡是两个相反的过程。从最外层元素开始，最里层结束
8、. Event.type()方法：该方法的作用是可以获取到事件的类型
$(“a”).click (function(event){ alert(event.type);//获取事件类型 return false;//阻止连接跳转 })；
9、. Event.pageX()方法/event.pageY()方法：该方法的作用是获取的光标相对于页面的 x 坐标和 y 坐标。如果没有使用jQuery时，那么IE浏览器中是用event.x()/event.y ()方法 而在Firefox浏览器中是用event.pageX()/event.pageY()方法。
$(“a”).click (function (event){ alert(“Current mouse position:” + event.pageX + “ , ” + event.pageY); //获取鼠标当前相对于页面的坐标 return false; // 阻止连接跳转 })；
10,show()和hide()方法:
$(function(){ $(“#panel h5.head”).toggle(function(){ $(this).next(“div.content”).hide() },function(){ $(this).next(“div.content”).show(); }); });
$(“#panle h5.head”).toggle(function(){ $(this).next(“div.content”).hide(600); },function(){ $(this).next(“div.content”).show(600); });
11:show（）方法和hide（)方法会同时修改元素的多个样式属性，即高度、宽度和不 透明度；fadeOut（）方法和fadeIn（）方法只会修改元素的不透明度 ；slideDown（）方法和slideUp（）方法只会u改变元素的高度。
12,jQuery的事件:
