JQuery事件

Jquery页面载入事件
$(document).ready()方法当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。这是事件模块中最重要的一个函数，因为它可以极大地提高web应用程序的响应速度。简单地说，这个方法纯粹是对向window.load事件注册的替代方法。通过使用这个方法，可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数，而99.99注：可以在同一个页面中无限次地使用$(document).ready()事件。其中注册的函数会按照（代码中的）
先后顺序依次执行。
鼠标事件：
1．click单击事件
$(".box").click(function () {
alert(“这是一个click单击事件被触发了”) });
2．dblclick鼠标双击事件
$(".box").dblclick(function () {
alert(“这是一个dblclick鼠标双击事件被触发了”) });
3．mousedown 鼠标移动到某个元素上被按下的时候触发的事件
$(".box").mousedown(function () {
alert(“这是一个mousedown鼠标被按下的时候触发”); });
4．mouseup当在元素上放松鼠标按钮时
$(".box").mouseup(function () {
alert(“这是一个mouseup当在元素上放松鼠标按钮时触发的事件”); });
5．mouseenter事件
$(".box").mouseenter(function () {
console.log(“mouseenter”); });
6．mouseleave事件
$(".box").mouseleave(function () {
console.log(“mouseleave”); });
7．mouseover事件
$(".box").mouseover(function () {
console.log(“mouseover”); });
8．mouseout
$(".box").mouseout(function () {
console.log(“mouseout”); });
hover事件
hover([over,]out)
一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。这是一个自定义的方法，
它为频繁使用的任务提供了一种“保持在其中”的状态。当鼠标移动到一个匹配的元素上面时，
会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。而且，
会伴随着对鼠标是否仍然处在特定元素中的检测（例如，处在div中的图像），如果是，
则会继续保持“悬停”状态，而不触发移出事件（修正了使用mouseout事件的一个常见错误）。
参数说明：
ver:鼠标移到元素上要触发的函数
out:鼠标移出元素要触发的函数
表单事件：

1. focus() 事件
   当元素获得焦点时，触发focus事件。可以通过鼠标点击或者键盘上的TAB导航触发。这将触发
   所有绑定的focus函数。
2. blur() 事件
   当元素失去焦点时触发 blur 事件。这个函数会调用执行绑定到blur事件的所有函数，包括
   浏览器的默认行为。可以通过返回false来防止触发浏览器的默认行为。blur事件会在元素
   失去焦点的时候触发，既可以是鼠标行为，也可以是按tab键离开的。
3. focusin() 事件
   当元素获得焦点时，触发 focusin 事件。
   focusin事件跟focus事件区别在于，他可以在父元素上检测子元素获取焦点的情况。
4. focusout() 事件
   当元素失去焦点时触发 focusout 事件。
   focusout事件跟blur事件区别在于，他可以在父元素上检测子元素失去焦点的情况。
   5．change()事件
   元素，和元素的值都是可以发生改变的，开发者可以通过
   change事件去监听这些改变的动作。
   input元素：监听value值的变化，当有改变时，失去焦点后触发change事件。对于单选
   按钮和复选框，当用户用鼠标做出选择时，该事件立即触发。
   select元素：对于下拉选择框，当用户用鼠标作出选择时，该事件立即触发。
   textarea元素：多行文本输入框，当有改变时，失去焦点后触发change事件。
   6．select()事件
   当textarea或文本类型的input元素中的文本被选择时，会发生 select 事件。
   这个函数会调用执行绑定到select事件的所有函数，包括浏览器的默认行为。
   可以通过在某个绑定的函数中返回false来防止触发浏览器的默认行为。
   7．submit()事件
   提交表单是一个最常见的业务需求，比如用户注册，一些信息的输入都是需要表单的提交。
   同样的有时候开发者需要在表单提交的时候过滤一些的数据、做一些必要的操作
   （例如：验证表单输入的正确性，如果错误就阻止提交，从新输入）此时可以通过submit事件，
   监听下提交表单的这个动作使用上非常简单，与基本事件参数处理保持一致
   这里需要特别注意：
   form元素是有默认提交表单的行为，如果通过submit处理的话，需要禁止浏览器的这个默认行为

，jQuery中可以直接在函数中最后结尾return false即可 键盘事件 1.鼠标有mousedown,mouseup之类的事件，这是根据人的手势动作分解的2个触发行为。 相对应的键盘也有这类事件，将用户行为分解成2个动作，键盘按下与松手，针对这样的2种动作， jQuery分别提供了对应keydown与keyup方法来监听： keydown()事件：当键盘或按钮被按下时，发生keydown事件。 keyup()事件：当按钮被松开时，发生keyup事件。它发生在当前获得焦点的元素上。 2.keypress()事件 在input元素上绑定keydown事件会有一个问题： 每次获取的内容都是之前输入的，当前输入的获取不到， keydown事件触发在文字还没敲进文本框，这时如果在keydown事件中输出文本框中的文本， 得到的是触发键盘事件前的文本，而keyup事件触发时整个键盘事件的操作已经完成， 获得的是触发键盘事件后的文本 当浏览器捕获键盘输入时，还提供了一个keypress的响应，这个跟keydown是非常相似 keypress事件与keydown和keyup的主要区别 只能捕获单个字符，不能捕获组合键；无法响应系统功能键（如delete，backspace） 不区分小键盘和主键盘的数字字符；因此KeyPress主要用来接收字母、数字等ANSI字符， 而 KeyDown 和 KeyUP 事件过程可以处理任何不被 KeyPress 识别的击键。 咧如：功能键（F1-F12）、编辑键、定位键以及任何这些键和键盘换档键的组合等。 事件的绑定和解绑 on()的多事件绑定 之前学的鼠标事件，表单事件与键盘事件都有个特点，就是直接给元素绑定一个处理函数， 所有这类事件都是属于快捷处理。翻开源码其实可以看到，所有的快捷事件在底层的处理都是通过 一个"on"方法来实现的。jQuery on()方法是官方推荐的绑定事件的一个方法。 基本用法：on(events,[selector],[data],fn) 在选择元素上绑定一个或多个事件的事件处理函数。 最常见的给元素绑定一个点击事件，对比一下快捷方式与on方式的不同 $("#elem").click(function(){}) //快捷方式 $("#elem").on('click',function(){}) //on方式 最大的不同点就是on是可以自定义事件名，多个事件绑定同一个函数： $("#elem").on("mouseover mouseout",function(){ }); 通过空格分离，传递不同的事件名，可以同时绑定多个事件 多个事件绑定不同函数 $("#elem").on({ mouseover:function(){}, mouseout:function(){}， click:function(){} }); 通过空格分离，传递不同的事件名，可以同时绑定多个事件，每一个事件执行自己的回调方法 卸载事件off()方法 通过.on()绑定的事件处理程序；通过off() 方法移除该绑定 根据on绑定事件的一些特性，off方法也可以通过相应的传递组合的事件名，名字空间， 选择器或处理函数来移除绑定在元素上指定的事件处理函数。当有多个过滤参数时， 只有与这些参数完全匹配的事件处理函数才会被移除 绑定2个事件：$("elem").on("mousedown mouseup",fn) 删除一个事件：$("elem").off("mousedown") 删除所有事件：$("elem").off("mousedown mouseup") 快捷方式删除所有事件，这里不需要传递事件名了，节点上绑定的所有事件讲全部销毁： $("elem").off()*/ 演示时取消注释： $("#div2").off("mousedown"); $("#div3").off();