<body> <div style="600px; height:200px; background-color:red"> <input type="button" id="btn" value="button" /> <a href="http://www.baidu.com">百度</a> </div> </body> </html> <script> $(function(){ //获取事件的类型 $('#btn').click(function(e){ alert(e.type); }) //获取触发元素的DOM $('#btn').click(function(e){ alert(e.target); }) //获取的是监听元素的DOM,你绑定的那个元素,就获取哪个元素 $('#btn').click(function(e){ alert(e.currentTarget); }) //获取事件调用时的额外数据,可以使数字,字符串,数组,对象 $('input').click(123,function(e){ alert(e.data); }) //pageX/pageY 获取相对页面原点的距离 screenX/screenY 获取显示屏位置的距离 clientX/clientY 获取相对于视点的距离 $(document).click(function(e){ alert(e.pageX+','+e.screenX+','+e.clientX); }) //获取事件调用时的时间戳 $('input').click(function(e){ alert(e.timeStamp); }) //获取鼠标或者键盘的按键 $('input').bind('click',function(e){ alert(e.which); }) //获取事件触发时是否按下ctrl,alt,shift键 $('input').bind('click',function(e){ alert(e.ctrlKey);//shiftKey,altKey }) //冒泡行为 $('input').click(function(e){ e.stopPropagation();//阻止冒泡行为 alert('input'); }) $('div').click(function(e){ alert('div'); }) $(document).click(function(e){ alert('document'); }) //默认行为(如超链接跳转 、表单提交等) $('input').click(function(e){ e.preventDefault();//阻止默认行为 alert('失效'); }) }) </script>