Event事件

一、焦点

obj.focus()给指定的元素设置焦点

obj.blur() 取消指定元素的焦点

obj.select()选择指定元素里的文本内容 用于分享内容之类的

二、Event： 事件对象； 当一个事件发生的时候，和当前这个对象发生的事件有关的一些详细信息都会被临时保存到一个指定的地方-Event对象，供我们需要的时候调用.

事件对象必须在一个事件调用的函数里面使用才有内容

事件函数： 事件调用的函数

兼容性： var ev = ev || event;

IE/chrome： event是一个内置全局对象

FF/标准下： 事件对象是通过事件函数第一个参数传入

如果一个函数是被事件调用的，这个函数定义的第一个参数就是事件对象

clientX[Y]：当一个事件发生，鼠标到页面可视区的距离

三、事件冒泡： 当一个元素接收到事件的时候，会把它接收到的所有事件传播给它的父级，一直到顶层window

阻止冒泡：当前要阻止冒泡的事件函数中调用 event.cancelBubble = true;

四、事件捕获：给一个对象的的同一个事件绑定多个不同的函数

 IE：obj.attachEvent（事件名称，事件函数）;

1.没有捕获

2.事件名称有'on'

3.事件函数执行的顺序：标准IE->正序非标准IE->倒序

4.this指向window

标准：obj.addEventListener（事件名称，事件函数，是否捕获）; 默认是false   

false：冒泡  告诉元素，如果有一个出去的事件触发了你，你就去执行XX函数

true：捕获    告诉元素，如果有一个进去的事件触发了你，你就去执行XX函数

1.有捕获

2.事件名称没有'on'

3.事件函数执行的顺序：正序

4.this指向触发该事件的对象

call：函数下的一个方法，call方法第一个参数可以改变函数执行过程中的内部this指向,call方法第二个参数开始就是原来函数的参数列表.

五、事件函数取消

1)普通事件取消 document.onclick = null;

2)绑定事件取消 IE：obj.detachEvent(事件名称，事件函数);

标准：obj.removeEventListener(事件名称，事件函数，是否捕获);

键盘事件： onkeydown：当键盘按键按下的时候触发

onkeyup：当键盘按键抬起的时候触发

event.keyCode：数字类型   键盘按键的键值

    ctrlKey，shiftKey，altKey 布尔值

    当一个事件发生的时候，如果ctrl   ||  shift  ||  alt 是按下的状态，返回true，否则返回false

//键盘控制div移动

var oDiv = document.getElementById('box');

document.onkeydown = function(ev){

var ev = ev || event;

switch(ev.keyCode){

case 37:

oDiv.style.left = oDiv.offsetLeft -10 + 'px';

break;

case 38:

oDIv.style.top = oDiv.offsetTop -10 + 'px';

break;

case 39:

oDiv.style.right = oDiv.offsetRight +10 + 'px';

break;

case 40:

oDiv.style.top= oDiv.offsetTop + 10 + 'px';

break;

}

}

六、事件默认事件：当一个事件发生的时候浏览器会默认做的事情

阻止默认事件：在这个事件的处理函数中使用return false;

  document.onkeydown = function(){ return false;}

 oncontextmenu：右键菜单事件(环境菜单)

自定义右键菜单

var oDiv = document.getElementById('box');

document.oncontextmenu = function(ev){

var ev = ev || event;

oDiv.style.display = 'block';

oDiv.style.left = ev.clientX + 'px';

oDiv.style.top = ev.clientY + 'px'l;

return false;

}

document.onclick = function(){

oDiv.style.display = 'none';

}