jQuery使用手册之事件处理(7)

jQuery的事件处理，有方法：
hover(Function, Function)
当鼠标move over时触发第一个function，当鼠标move out时触发第二个function
样式：

<style>.red{color:#FF0000}</style>

Html代码：

<div id="a">sdf</div>

jQuery代码及效果

$(function(){
  $("#a").hover(function(){$(this).addClass("red");},
                            function(){ $(this).removeClass("red");
                          });
})

最终效果是当鼠标移到id为a的层上时图层增加一个red样式，离开层时移出red样式

toggle

(Function, Function)
当匹配元素第一次被点击时触发第一个函数，当第二次被点击时触发第二个函数
样式：

<style>.red{color:#FF0000}</style>

Html代码：

<div id="a">sdf</div>

jQuery代码及效果

$(function(){
  $("#a"). toggle (function(){$(this).addClass("red");},
                              function(){ $(this).removeClass("red");
                            });
})

最终效果是当鼠标点击id为a的层上时图层增加一个red样式，离开层时移出red样式

另外jQuery的事件处理还有：
bind(type, fn)是用户将一个事件和触发事件的方式绑定到匹配对象上。
trigger(type)是用户触发type形式的事件。$("p").trigger("click")
以及unbind();unbind(type);unbind(type, fn)等

Dynamic event(Function)
绑定和取消绑定提供函数的简捷方式
例：

$("#a").bind("click",function() {
                                       $(this).addClass("red");
})

也可以这样写：

$("#a").click(function() {
                        $(this).addClass("red");
});

最终效果是当鼠标点击id为a的层上时图层增加一个red样式，

jQuery提供的函数有以下

• 用于browers事件:
  
  
  
  • error(fn)
    
  • load(fn)
    
  • unload(fn)
    
  • resize(fn)
    
  • scroll(fn)
    
  
  
• 用于form事件
  
  
  
  • change(fn)
    
  • select(fn)
    
  • submit(fn)
    
  
  
• 用于keyboard事件
  
  
  
  • keydown(fn)
    
  • keypress(fn)
    
  • keyup(fn)
    
  
  
• 用于mouse事件
  
  
  
  • click(fn)
    
  • dblclick(fn)
    
  • mousedown(fn)
    
  • mousemove(fn)
    
  • mouseout(fn)
    
  • mouseover(fn)
    
  • mouseup(fn)
    
  
  
• 用于UI事件
  
  
  
  • blur(fn)
    
  • focus(fn)
    
  
  

以上事件的扩展再扩展为5类
比如click(fn);click();unclick();oneclick(fn);unclick(fn)

• click(fn)：增加一个点击时触发某函数的事件
  
• click()：可以在其他事件中执行匹配对象的click事件。
  
• unclick ()：不执行匹配对象的click事件。
  
• oneclick(fn)：只增加可以执行一次的click事件。
  
• unclick (fn)：增加一个点击时不触发某函数的事件。
  

上面列举的用于browers、form、keyboard、mouse、UI的事件都可以按以上方法扩展。