index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>事件对象</title>
<script type="text/javascript" src="jquery-1.10.1.js"></script>
<script type="text/javascript" src="demo.js"></script>
<link type="text/css" rel="stylesheet" href="style.css" />
</head>
<body>
<input type="button" value="按钮" />
<input type="text" value="按钮" />
<div style="width:200px; height:200px; background:#ccc;">
<span style="width:100px; height:100px; background:#eee; display:block;"></span>
</div>
<p style="height:2000px;"></p>
</body>
</html>
demo.js
$(function(){
/*
$('input').bind('click',function(e){
alert(e);
});
$('input').bind('click',function(e){
//alert(e.type);
//alert(typeof e.type);
});
$('input').bind('click',function(e){
alert(e.target);
});
$('input').bind('click',function(e){
alert(e.relatedTarget);
});
$('input').bind('click',function(e){
alert(e.currentTarget);
});
$('div').bind('click',function(e){
alert(e.target);
});
$('div').bind('click',function(e){
alert(e.currentTarget);
});
//target 是获取触发元素的 DOM,触发元素,就是你点了哪个就是哪个
//currentTarget 得到的是监听元素的 DOM,你绑定的哪个就是那个
$('span').bind('mouseover',function(e){
alert(e.relatedTarget);
});
$('div').bind('click',function(e){
alert(this == e.currentTarget);
});
$('div').bind('click',function(e){
alert(this == e.target);
});
$('div').bind('click',123,function(e){
alert(e.data);
});
$('div').bind('click','abc',function(e){
alert(e.data);
});
$('div').bind('click',[1,2,3,'a','b'],function(e){
alert(e.data[3]);
});
$('div').bind('click',{user:'Lee',age:100},function(e){
alert(e.data.age);
});
$(document).bind('click',function(e){
alert(e.pageX+','+e.screenX+','+e.clientX);
});
$(document).bind('click',function(e){
alert(e.pageY+','+e.screenY+','+e.clientY);
});
$('input').bind('click',function(e){
return 123;
});
$('input').bind('click',function(e){
alert(e.result);
});
$('input').bind('click',function(e){
return 123;
});
$('input').bind('click',function(e){
alert(e.result);
});
$('input').bind('click',function(e){
alert(e.timeStamp);
});
$('input').bind('mousedown',function(e){
alert(e.which);
});
$('input').bind('keyup',function(e){
alert(e.which);
});
*/
$('input').bind('click',function(e){
alert(e.ctrlKey);
});
});