jquery的几种常见事件

1.事件ready(fn)

当 DOM（文档对象模型） 已经加载，并且页面（包括图像）已经完全呈现时，会发生 ready 事件。通俗的来讲就是当页面加载完时就会执行此函数事件。可以在同一个页面中无限次地使用$(document).ready()事件。其中注册的函数会按照（代码中的）先后顺序依次执行。

$(document).ready(function(){
  // 在这里写你的代码...
});

使用 $(document).ready() 的简写(最常用)，同时内部的 jQuery 代码依然使用 $ 作为别名，而不管全局的 $ 为何。

$(function($) {
  // 你可以在这里继续使用$作为别名...
});

2.单击事件 click([[data],fn])

触发每一个匹配元素的click事件。

这个函数会调用执行绑定到click事件的所有函数。

//为id为btn的按钮添加单击事件
 $("#btn").click(function(){
              alert("触发单击事件");
          })
//单击p后，该p被隐藏
$("p").click( function () { $(this).hide(); });

3.双击事件 dblclick([[data],fn])

当鼠标指针停留在元素上方，然后按下并松开鼠标左键时，就会发生一次 click。在很短的时间内发生两次 click，即是一次 double click 事件。提示：如果把 dblclick 和 click 事件应用于同一元素，可能会产生问题。

 //为id为btn的按钮添加双击事件
$("#btn").dblclick(function(){
              alert("触发双击击事件");
          })

4.鼠标移入事件 mousemove([[data],fn])

当鼠标指针在指定的元素中移动时，就会发生 mousemove 事件。

mousemove事件处理函数会被传递一个变量——事件对象，其.clientX 和 .clientY 属性代表鼠标的坐标

不论鼠标指针离开被选元素还是任何子元素，都会触发mousemove事件。只有在鼠标指针离开被选元素时，才会触发 mouseenter 事件。

  //当鼠标移入页面获得鼠标指针在页面中的位置，显示在span中
$(document).mousemove(function(e){
  $("span").text(e.pageX + ", " + e.pageY);
});

5.鼠标移出事件 mouseout([[data],fn])

当鼠标指针从元素上移开时，发生 mouseout 事件。

该事件大多数时候会与 mouseover 事件一起使用。

注释：与 mouseleave 事件不同，不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。请看下面例子的演示。

   //当鼠标从元素上移开时，改变元素的背景色：
$("p").mouseout(function(){
  $("p").css("background-color","#E9E9E4");
});

6.鼠标复合事件（hover([over,]out)）

一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。这是一个自定义的方法，它为频繁使用的任务提供了一种“保持在其中”的状态。

当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。而且，会伴随着对鼠标是否仍然处在特定元素中的检测（例如，处在div中的图像），如果是，则会继续保持“悬停”状态，而不触发移出事件（修正了使用mouseout事件的一个常见错误）。

over:鼠标移到元素上要触发的函数

out:鼠标移出元素要触发的函数

$("td").hover(
   //鼠标悬停的表格加上特定的类
  function () {
    $(this).addClass("hover");//不同于js，addClass不会覆盖原来的类，而是可以两个类共用
  },
     //鼠标移出的表格加删除类
  function () {
    $(this).removeClass("hover");
  }
);

7.键盘按下事件 keydown([[data],fn])

当键盘被按下时，发生 keydown 事件。

注释：如果在文档元素上进行设置，则无论元素是否获得焦点，该事件都会发生。

 $(window).keydown(function(event){
    //当在页面按下键盘，弹出该键的Keycode
        alert(event.keyCode);
    // ...
    // 不同的按键可以做不同的事情
    // 不同的浏览器的keycode不同
    // 更多详细信息:     http://unixpapa.comjs/key.html
    // 常用keyCode： 空格 32   Enter 13   ESC 27

});

8.键盘松开事件 keyup([[data],fn])

当按钮被松开时，发生 keyup 事件。它发生在当前获得焦点的元素上。

注释：如果在文档元素上进行设置，则无论元素是否获得焦点，该事件都会发生。

$("input").keyup(function(){
    //键盘松开，改变文本域颜色
  $("input").css("background-color","red");
});

9.键盘打字事件 keypress([[data],fn])

当键盘或按钮被按下时，发生 keypress 事件。

keypress 事件与 keydown 事件类似。当按钮被按下时，会发生该事件。它发生在当前获得焦点的元素上。 不过，与 keydown 事件不同，每插入一个字符，就会发生 keypress 事件。注释：如果在文档元素上进行设置，则无论元素是否获得焦点，该事件都会发生。

$("input").keypress(function(){
    //键盘产生可打印字符
  alert(“键盘打字”);
});

10.元素获得焦点 focus([[data],fn])

当元素获得焦点时，触发 focus 事件。

可以通过鼠标点击或者键盘上的TAB导航触发。这将触发所有绑定的focus函数，注意，某些对象不支持focus方法。

//为type=text的文本框添加获得焦点事件
$("input[type=text]").focus(function(){
//使人无法使用文本框:
  this.blur();//当前节点失去焦点
});

11.元素失去焦点 blur([[data],fn])

当元素失去焦点时触发 blur 事件。

这个函数会调用执行绑定到blur事件的所有函数，包括浏览器的默认行为。可以通过返回false来防止触发浏览器的默认行为。blur事件会在元素失去焦点的时候触发，既可以是鼠标行为，也可以是按tab键离开的。

//任何段落失去焦点时弹出一个 "Hello World!"在每一个匹配元素的blur事件中绑定的处理函数。
$("p").blur( function () { alert("Hello World!"); } );

12.元素值改变 change([[data],fn])

当元素的值发生改变时，会发生 change 事件。

该事件仅适用于文本域（text field），以及 textarea 和 select 元素。当用于 select 元素时，change 事件会在选择某个选项时发生。当用于 text field 或 text area 时，该事件会在元素失去焦点时发生。

$("input[type='text']").change( function() {
  // 这里可以写些验证代码
});

13.表单提交事件 submit([[data],fn])

当提交表单时，会发生 submit 事件。

该事件只适用于表单元素。

//提交本页的第一个表单
$("form:first").submit();

//如果你要阻止表单提交:
$("form").submit( function () {
  return false;
} );