事件基础 (事件对象 阻止事件冒泡)

事件对象:

IE下:就叫 event对象

ff,chrome:传到事件处理函的那个参数名字(随便起)

event对象:根据事件类型有具体的事件对象,比如mouseEvent keyboardEvent等,这些对象有各自的属性,如clientX keyCode等

如:

ie下

document.body.onclick=function(){

 console.log(event.clinetX);

}

ff 、chrome下

document.body.onclick=function(ev){

 console.log(ev.clinetX);

}

做兼容:

document.body.onclick=function(ev){

if(ev){

console.log(ev.clientX);} else{

console.log(event.clientX);

}

}

兼容优化:

预备知识:或 ||

var a=1||0;
var b=0||1;
var c=2||3;
var d=""||3;
var e=false||0;
var f=0||false;
console.log(a);//1
console.log(b);//1
console.log(c);//2
console.log(d);//3
console.log(e);//0
console.log(f);//false

可见,||在赋值号的右边时  从右往左,遇到真值就停,遇不到真值返回最后那个值。

 

so,事件对象简化的兼容写法 : var ev=ev||event;(ev为传到事件处理函数的参数) 那么可以传event作为参数吗?

事件冒泡  

阻止事件冒泡:

mouseEvent的 clientX clientY 属性

clientX clientY 相对于可视区的坐标

 

 tips:用到这两个属性时,一定和滚动条一起用 scrollTop scrollLeft

var ev=ev||event;

ele.left=ev.clientX+scrollLeft(要做兼容)+"px"

 

posted @ 2015-05-10 17:11  hello,w  阅读(325)  评论(0编辑  收藏  举报