jquery的事件对象就是js事件对象的一个封装,就是做了一个兼容性的封装。
screenX和screenY 对应屏幕最左上角的值
clientX和clientY 距离页面左上角的位置(忽略滚动条)
pageX和pageY 距离页面最顶部的左上角位置(会计算滚动条的位置)
event.keyCode 按下的键盘代码
event.data 存储绑定事件时传递的附加数据
以上几种不详细说了,接下来说一下下面的几种:
event.stopPropagation(); //阻止事件冒泡行为 event.preventDefault(); //阻止浏览器默认行为 return false;//既能阻止事件冒泡,又能阻止浏览器默认行为
来看简单小例子,a标签的href里面传链接即可跳转,来看代码:
<a href="http://www.cnblogs.com/web001/">点击</a> 以上是html的a标签 <script src="js/jquery-1.11.3.min.js"></script> <script> $(function(){ $("a").on("click",function(e){ alert("麦兜"); }); $("body").on("click",function(){ alert("呵呵"); }) }) </script>
那么它的执行结果肯定是先弹出“麦兜”再弹出“呵呵”,然后跳转http://www.cnblogs.com/web001/这个链接,若是不想跳转走的话,那就要这么写:
$("a").on("click",function(e){
alert("麦兜");
e.preventDefault();//阻止浏览器的默认行为
});
$("body").on("click",function(){
alert("呵呵");
})
那若是不让弹出“呵呵”的话就要这样写:
$("a").on("click",function(e){
alert("麦兜");
e.stopPropagation(); //阻止事件冒泡
});
$("body").on("click",function(){
alert("呵呵");
})
若是既不让链接跳转也不让弹出“呵呵”,那么就要这样写:
$("a").on("click",function(e){
alert("麦兜");
return false;//既能阻止冒泡,也能阻止浏览器默认行为
});
$("body").on("click",function(){
alert("呵呵");
})
所以,以上的几个方法可以灵活运用,根据实际情况实际运用。