“事件”这一名词，在我们看来，已经是非常熟悉的了。在C/S项目中，我们都是通过触发各种事件来实现各种功能的。比如说：按钮点击事件，窗体加载事件等。而在B/S项目中，同样有事件这一概念。这篇博客就对JavaScript视频中关于事件的知识点做个总结。
导图中是视频（63-68集）关于讲解事件的全部内容，下面再具体总结一下。
抽象部分
一.JavaScript事件
它是由访问Web页面的用户引起的一系列操作。例如：用户点击。当用户点击执行某些操作的时候，再去执行一系列代码。
二.JavaScript有三种事件模型
内联模型、脚本模型和DOM2模型。
比较：内联模型与脚本模型
内联是和HTML混写的，没有与HTML分离。
举例：
//HTML中把事件处理函数作为属性执行JS代码（内联模型）
<input type="button" value="按钮" onclick=“alert('Lee');"/>
//在JavaScript中处理事件（脚本模型）
var input=document.getElementsByTagName('input')[0];
input.onclick=function(){
alert('Lee');
};
三.JavaScript可以处理的事件类型
鼠标、键盘和HTML事件。
下面各列举几个实例：
1.鼠标事件
click：点击鼠标或按回车触发
input.onclick=function(){
alert('Lee');
};
mousedown：按下未弹起触发
input.onmousedown=function(){
alert('Lee');
};
2.键盘事件
keydown：按任意键触发，如果不放，则重复触发
onkeydown=function(){
alert('Lee');
};
keyup:释放键盘上的键触发
onkeyup=function(){
alert('Lee');
};
3.HTML事件
load:页面完全加载后在window上触发
window.onload=function(){
alert('Lee');
};
change:当文本框内容改变且失去焦点后触发
input.onchange=function(){
alert('Lee');
};
submit：当用户点提交按钮在<form>元素上触发
form.onsubmit=function(){
alert('Lee');
};
具体部分
一.事件对象
一般称作为event对象，它是浏览器通过函数把这个对象作为参数传递过来的。
二.鼠标事件
获取按钮信息
获取屏幕坐标
修改键
三.键盘事件
键码：发生keydown和keyup事件时，event对象的keycode属性中会包含一个代码，与键盘上一个特定的键对应。
字符编码：发生keypress事件，event对象charCode属相包含键所代表字符的ASCII编码。
四.事件流
包括两种模式：冒泡与捕获
事件冒泡是从里往外逐个触发，事件捕获是从外往里逐个触发。现代浏览器默认都是冒泡模型。
绑定部分
一.传统事件绑定问题
问题一：一个事件处理函数触发两次事件。当两个JS同时执行的时候，后面一个会把前面一个完全覆盖掉。
解决：
执行前先判断之前是否有window.onload，创建一个保存器，把之前的window.onload保存起来。
代码：
window.onload=function(){ //第一个要执行的事件
alert('Lee');
};
if (typeof window.onload=='function'){ //判断之前是否有window.onload
var saved=null; //创建一个保存器
saved=window.onload; //保存之前的window.onload
}
window.onload=function(){ //最终一个要执行事件
if(saved)saved(); //执行之前一个事件
alert('Mr.Lee'); //执行本事件的代码
};
问题二：事件切换器在扩展时，之前的会被覆盖。或者解决覆盖问题后，就必须包含同时执行，又出新问题。
解决：创建一个自定义的事件处理函数
代码：
function addEvent(obj,type,fn){ //取代传统处理函数
var saved=null; //保存每次触发的事件处理函数
if (typeof obj['on'+type]=='function'){ //判断是不是事件
saved=obj['on'+type]; //如果有，保存
}
obj['on'+type]=function(){
if(saved)saved(); //执行上一个
fn.call(this); //执行函数，传递this
};
}
addEvent(window,'load',function(){ //执行
alert('Lee');
});
addEvent(window,'load',function(){ //执行
alert('Mr.Lee');
});
二.W3C事件处理函数
W3C现代事件绑定好处：不需要自定义；可以屏蔽相同的函数；可以设置冒泡和捕获
三.IE事件处理函数
IE不支持捕获；添加事件不能屏蔽重复的函数；this指向的是window而不是DOM对象；在传统事件上，IE无法接受到event对象。
学习这部分内容，其实很多东西都是很有共鸣的。但后面的一些事件流，自定义，(添加超链接）IE与W3C间的比较的知识，好像使得学习困难了些，总结的时候也不知道该如何去写，只能是列举出个大概的标题。这些东西，还是需要在实践中去应用。
