事件处理函数
一.指定事件处理函数
通过下面方法：
jQuery选择器.事件名(function()){
<函数体>
});
二.绑定到事件处理函数
1.bind()方法 可以为每一个匹配元素的特定事件（像click）绑定一个事件处理函数。事件处理函数会接收到一个事件对象。
语法：bind(type,[data],fn)
type:事件类型；
data:可选参数，作为event.data属性值传递给事件Event对象的额外数据对象。
fn:绑定到指定事件的事件处理函数。如果fn的函数返回false,则会取消事件的默认行为，并阻止冒泡。
示例：使用bind（）方法绑定事件处理函数。
<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="jquery(1).js"></script>
</head>
<body>
<input id="name"/>
<script>
$("input").bind("click",function(){
alert($(this).val());
});
</script>
</body>
</html>示例：使用bind(）方法在事件处理之前传递附加的数据。
<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="jquery(1).js"></script>
</head>
<body>
<input id="name"/>
<script>
function handler(event){
alert(event.data.foo);
}
$("input").bind("click",{foo:"hello"},handler);
</script>
</body>
</html>在bind()方法中，使用{foo:"hello" }向事件处理函数传递函数。参数名为：foo。参数值为："hello"。
在事件处理函数中，可以使用event.data.foo获得参数值。
示例：使用bind()方法禁止网页弹出右键菜单。
<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="jquery(1).js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(document).bind("contextmenu",function(e){ //contextmenu 鼠标右键
return false;
});
});
</script>
</head>
<body>
<p>右击网页，将不会弹出右键菜单。</p>
</body>
</html>在bind()方法中，指定contextmenu(右击)事件的处理函数返回false,从而取消事件的默认行为。
2.delegate()方法
使用delegate()方法将制定元素的特定子元素绑定到指定的事件处理函数。
语法：.delegate(selector,eventType,handler(eventObject))
selector:匹配子元素的选择器
eventType：事件类型
handler(eventObject)：事件处理函数
示例：
<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="jquery(1).js"></script>
<style>
p{
background:yellow;
font-weight:bold;
cursor:pointer;
padding:5px;
}
p.over{
background:#ccc;
}
span{
color:red;
}
</style>
</head>
<body>
<p>Click me</p>
<span> </span>
<script type="text/javascript">
$("body").delegate("p","click",function(){
$(this).after("<p>Another paragraph</p>");
});
</script>
</body>
</html>注意：delegate（）与bind( )两个方法的区别。
3.移除事件绑定
unbind（）
三.Event对象
示例：Event对象pageX和pageY属性（鼠标与文档边缘的距离）
<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="jquery(1).js"></script>
<style>
div{
color:red;
}
</style>
</head>
<body>
<div id="log"></div>
<script type="text/javascript">
$(document).mousemove(function(e){
$("#log").text("e.pageX:"+e.pageX+",e.pageY:"+e.pageY);
});
</script>
</body>
</html>示例：type属性和which属性：
type：事件类型
which：用于键盘事件、鼠标事件，表示按下的键或鼠标按钮
<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="jquery(1).js"></script>
<style>
div{
color:red;
}
</style>
</head>
<body>
<input id="whichkey" value=""/>
<div id="log"></div>
<script type="text/javascript">
$("#whichkey").keydown(function(e){
$("#log").html(e.type+":"+e.which);
});
</script>
</body>
</html>注意：当在input元素中输入字符时才会在页面中显示触发的事件类型和字符对应的ASCI码数值。