一、绑定事件
正常你给一个对象绑定两个相同的事件，下面的会覆盖上面的
2.如果你用addEventListener的话就解决了
用addEventListener可以同时给一个对象绑定两个相同的事件，且都能输出来
addEventListener有三个参数，最后那个可不写
但是这个函数呢，有兼容性，他只在标准浏览器下可以，在IE下不行，但是呢，有一个方法attachEvent和他正好相反，在IE可以，标准不行，他只有俩参数
那么这两个函数，一个只能在标准浏览器下，另一个只能在IE下，怎么才能兼容呢，封装一个函数吧
到此为止，你以为就完事了？No！ 可怕的IE不仅有兼容性问题，还有bug，对，bug，正常来说，在事件里的this都指向绑定事件的对象吧，但在IE里，attachEvent事件里的this指向window
请参照我的另一篇文章this指向问题
解决方案如下
综上，绑定事件的最终代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>事件</title>
<style>
#div1{
width: 200px;
height: 200px;
background: #ff0;
}
</style>
</head>
<body>
<div id="div1"></div>
<script>
var oDiv1 = document.getElementById("div1");
function addEvent(elem,type,fn,flag){
if(elem.addEventListener){
elem.addEventListener(type,fn,flag);
}else{
elem.attachEvent("on"+type,function(){
fn.call(elem);
});
}
}
addEvent(oDiv1,"click",function(){
console.log("111112222");
},false);
</script>
</body>
</html>二、事件冒泡(具体请看另一篇文章事件冒泡)
三、键盘事件
四、事件源
this和事件源target可不一样哦，
* this是谁绑定的事件，指向谁
* e.target事件源是，谁触发的事件，也就是点击的谁，谁就是事件源，不管他是不是绑定事件的那个
* e.currentTarget 和this是一样滴
五、阻止浏览器默认行为的事件
我们原先是这么做的 return false
现在，新学两种阻止浏览器默认行为的】
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>其他事件</title>
</head>
<body>
<a id="btn" href="http://www.baidu.com">不让他跳转到百度页面</a>
<script>
// document.onkeydowm = function(e){
//
// var keycode = e.keyCode || window.event.which;
// console.log(keycode);
// }
//阻止浏览器默认行为的
var oBtn = document.getElementById("btn");
oBtn.onclick = function(e){
e = e || window.event;
e.preventDefault();
alert("hhhhhh");
// e.returnValue = false;
}
</script>
</body>
</html>