事件处理

事实上，在上边的例子中很多地方已经涉及到 jQuery 事件处理部分了。jQuery 不但提供 基本的 bind/unbind 来负责注册及删除事件处理器，同时还提供很多更方便 web 开发的 的助手函数，如 toggle/hover 等。

注册一个事件处理器非常容易：

var base = $("div#base"); 
base.bind('click', function(event){
alert($(this).width()+", "+$(this).height()); 
});

当鼠标单击 ID 为 base 的 div 时，触发该事件。使用 unbind 将事件处理器删除。我们来 看一个小例子：

单击 bind 按钮时，我们为按钮上方的 div 注册 click 事件处理器，点击 unbind 时，移除该事件处理器：

$("input#bind").click(function(){ 
base.bind('click', function(event){
alert($(this).width()+", "+$(this).height()); 
});
});
$("input#unbind").click(function(){ 
base.unbind('click');
});

这样，点击 bind 之后，点击 div 则会弹出一个对话框：

点击 unbind 之后，div 将不会再处理 click 事件。有时候，我们会需要为单击的次数为奇 数和偶数时注册不同的事件处理器，如第一次单击时将 panel 的背景色变为红色，再次单击则将背景色变为黄色，这时候我们可以使用 toggle 函数：

var base = $("div#base");
base.toggle( function(){
$(this).css('background', 'red'); 
},
function(){
$(this).css('background', 'yellow');
} 
);

当然，更多的是处理鼠标移入/移出事件的 hover，当用户在页面上移动鼠标，将展现不同的视觉效果：

base.hover( 
function(event){
$(this).css('background', 'red'); 
},
function(event){ 
$(this).css('background', 'yellow');
} 
);