jQuery 常用事件

常用事件

bind() 方法

bind() 方法为被选元素添加一个或多个事件处理程序，并规定事件发生时运行的函数。
语法：

$(selector).bind(event,data,function)

实例：
当点击鼠标时，隐藏或显示 p 元素：

$("button").bind("click",function(){
  $("p").slideToggle();
});

unbind() 方法

unbind() 方法移除被选元素的事件处理程序。

该方法能够移除所有的或被选的事件处理程序，或者当事件发生时终止指定函数的运行。

ubind() 适用于任何通过 jQuery 附加的事件处理程序。
语法：

$(selector).unbind(event,function)

实例：
移除所有 p 元素的事件处理器：

$("button").click(function(){
  $("p").unbind();
});

one() 方法

one() 方法为被选元素附加一个或多个事件处理程序，并规定当事件发生时运行的函数。

当使用 one() 方法时，每个元素只能运行一次事件处理器函数。
语法：

$(selector).one(event,data,function)

实例：
当点击 p 元素时，增加该元素的文本大小：

$("p").one("click",function(){
  $(this).animate({fontSize:"+=6px"});
});

mouseover() 方法和mouseout() 方法

当鼠标指针位于元素上方时，会发生 mouseover 事件。
当鼠标指针从元素上移开时，发生 mouseout 事件。

mouseover() 方法

语法：

$(selector).mouseover()

实例：
当鼠标指针位于元素上方时时，改变元素的背景色：

$("p").mouseover(function(){
  $("p").css("background-color","yellow");
});

mouseout() 方法

语法：

$(selector).mouseout()

实例：
当鼠标从元素上移开时，改变元素的背景色：

$("p").mouseout(function(){
  $("p").css("background-color","#E9E9E4");
});

focus() 方法和blur() 方法

当元素获得焦点时，发生 focus 事件。
当元素失去焦点时发生 blur 事件。

focus() 方法

语法：

$(selector).focus()

实例：
当输入框获得焦点时，改变它的背景色：

$("input").focus(function(){
  $("input").css("background-color","#FFFFCC");
});

blur() 方法

语法：

$(selector).blur()

实例：
当输入域失去焦点 (blur) 时改变其颜色：

$("input").blur(function(){
  $("input").css("background-color","#D6D6FF");
});

keypress() 方法

keypress 事件与 keydown 事件类似。当按钮被按下时，会发生该事件。它发生在当前获得焦点的元素上。

不过，与 keydown 事件不同，每插入一个字符，就会发生 keypress 事件。

keypress() 方法触发 keypress 事件，或规定当发生 keypress 事件时运行的函数。

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

$(selector).keypress()

实例：
计算在输入域中的按键次数：

$("input").keydown(function(){
  $("span").text(i+=1);
});