javascript event

1.焦点事件

onfocus //不是所有的元素都接受焦点，有相应用户操作的元素才行
obj.focus() //百度效果
onblur
obj.blur()
obj.select() //选择全选的内容

---

2.event事件对象和clientX,clientY

event 事件对象 （在事件函数中调用才有效）
兼容性
内置的全局对象 event:
IE 显示为 null
chrome 显示为 undefine
Firefox 事件对象通过事件函数的第一个函数参数调用 function fn(ev){}
ev 标准

//查看ev对象
 for(var attr in ev){
    console.log(rv[attr])；
 }

• clientX（左到右）, clientY （右到左） 鼠标的位置
• onmousemove 时间间隔变化来触发

    //鼠标移动oDiv跟着移动
    var ev  = ev || event;    //兼容解决方法
    var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
    oDiv.style.left = ev.clientX+'px';
    oDiv.style.top = ev.clientY+ scrollTop+'px'; 

---

3.事件流、事件冒泡机制

• 事件冒泡 （有时事件处理函数的事件（事件和函数的绑定））从内到外， 传播到父级

• 当前要阻止冒泡的事件函数中调用 ev.cancelBubble = true 只能单独阻止

4.事件绑定的第二种形式

• 为了解决事件函数的覆盖，同个事件绑定多个不同的函数

ie: 事件捕获 obj.attachEvent(事件名称，事件函数)

特点：
1.没有捕获
2.事件有on
3.事件函数的执行顺序 标准ie -》正序 非标准ie -》倒序
4.this 指向window
解决方法call 第一个参数可以改变函数this执行的指向， null 指向 原本的执行,调用函数 fn() == fn().call()

---

使用:
document.attachEvent(‘onclick’,fn);

标准: obj.addEventListener(事件名称，事件函数,是否捕获) false: 冒泡 true:捕获

特点:
1.有捕获
2.事件没有on
3.事件函数的执行顺序 正序
4.this 指向触发该事件的对象 （正常）

---

document.addEventListener(‘click’,fn，false);

兼容封装绑定

   function bind(obj,evname,fn){}
            if(obj.addEventListener){
                  obj.addEventListener(obj,evname,false);
            }else{

                  obj.attachEvent('on'+evname,function(){
                          fn.call(obj);
                  });
            }

   bind(document,'click',function(){alert(1)}）;