js函数事件对象

  每个函数都有4个默认对象
    arguments 保存着实际传入的参数，集合列表
    return 有两个功能，打断函数和返回函数值
    this 谁调用的函数，this就是谁
    event 事件对象

事件

  box.onlick=function(){}
  表示点击 box 触发了一个函数。
  事件包含三点：
    1 谁触发的
    2 触发了什么事件
    3 触发的事件执行了什么动作

  焦点事件： 使浏览器能区分用户输入的对象。
    当一个元素有焦点的时候可以接受用户输入。
    不是所有元素都有焦点，能响应用户输入的才有焦点。
    onfocus 当元素获得焦点时。
    onblur 当元素失去焦点时。

  文本域的空白符会被识别。
  选中： obj.select();
  obj 文本域 textarea ，支持 select ,但比如 p 标签不支持。

事件对象 event 对象

  当一个事件发生的时候和当前事件发生有关的详细信息，都会被临时保存在一个指定的地方。
  event 对象，供我们需要时调用。像飞机的黑匣子。

  当在页面上发生了某事件的时候，会被事件对象记录。

window.onclick=function(e){

  console.log(e) //MouseEvent {isTrusted: true…}

}

  事件对象的兼容处理
  e=event||window.event;
  ie/谷歌中： event 是一个内置的全局对象。
  标准下： 事件对象是通过事件函数的第一个参数传入的。

window.onclick=function(e,f){

  //var f;

  console.log(f) //undefined

}

  没有事件发生：输出 undefined

console.log(window.event) //undefined

console.log(event) //undefined

  形式参数和实际参数
  形式参数：
    相当于在函数内定义一个局部变量。

  如果一个函数是被事件调用的，这个函数定义的第一个参数就是事件对象。 arguments[0] 实际参数的第一个值。

window.onclick=function(e){

  console.log(arguments[0]) //MouseEvent {isTrusted: true, screenX: 1027…}

}

  没有事件调用时： fn(1,2) 输出3

function fn(a,b){

  console.log(a+b) //3

}

fn(1,2)

  有事件调用时： 还是输出3

function fn(a,b){

  console.log(this) //window

  //

  console.log(a+b) //3

}

window.onclick=function(){

  fn(1,2) //3

}

  clientX: number
  clientY: number
  当一件事件发生的时候，鼠标到页面的可视距离

  onmousemove 当鼠标移动的时候
  当鼠标在一个元素上移动的时候触发。触发频率不是像素，而是时间间隔。
  在一个指定的时间内，如果鼠标位置和上次的位置发生变化，就会触发。

  onmousedown 鼠标按下。
  onmouseup 鼠标抬起。

  onclick 是按下再抬起。

  onmouseover 是鼠标移上时触发的事件。
  onmouseout 是鼠标移出的时候触发事情。

事件冒泡

  当一个元素接收到事件的时候，会把接收的所有传递父级。一直到顶层的 window 对象。

<div id="d1">

  <div id="d2">

    <div id="d3"></div>

  </div>

</div>

  点击d3时会把事件传到d2、d1。如果大家都有点击事件时，点击d3，会相当于全部都点击了。
  如果d1、d2没有点击事件时，其实点击事件也是冒泡到其身上的，只是没有执行。

  阻止事件冒泡：

e.stopPropagation() //常用方式，标准浏览器。不支持ie

e.cancelBubble=true; //不支持ie

return false //不支持ie

window.cancelBubble=true; //谷歌、ie

  阻止事件冒泡兼容

e=event||window.event;

e.cancelBubble=true;

e.stopPropagation();

  例如：

box.onclick=function(ev){

  var e=ev||window.event;

    alert("我是box2");

    e.cancelBubble=true;

    e.stopPropagation();

}

默认事件

  浏览器本身会存在一些默认事件，比如鼠标右键的菜单。
  阻止默认事件：
  如果不阻止，点击鼠标右键时首先会弹出1，再弹右键菜单。
  阻止后不弹出右键菜单。

document.oncontextmenu=function(ev){

      var e=ev||window.event;

      e.returnValue=false; //ie中

      e.preventDefault();

      alert(1)

}

键盘事件

  onkeydow 当按下键盘的时候。