<script>
/**
*事件对象,当一个事件发生的时候,和当前这个对象发生的这个事件相关的详细信息都会被临时保存到一哥指定的地方-event,供我们调用
*事件函数:
*兼容:
*ie/chrome alert(event) undefined
*event是一个内置的全局对象
*Firefox (标准)事件对象通过事件函数的第一个参数调用高
*
* screenX screenY
* clientX clientY 鼠标到页面可视区距离
*
* onmousemove 触发频率不是像素,而是间隔时间
*/
//实例
document.onmousemove = function(ev){
var ev = ev || event;
var scrollTop = document.documentElement.scrollTop + document.body.scrollTop;
div.style.left = ev.clientX + 'px';
div.style.top = ev.clientY + scrol + 'px';
}
//事件冒泡
<script>
/**
* 事件冒泡:当一个元素接收到事件的时候,会把他接收到的所有传播给父级一直到顶层的window
* 阻止冒泡:当前阻止冒泡的事件函数中调用 event.cancleBubble=true
* 事件捕获
* ie 下是没有的,在绑定事件中,标注你啊是有的
*
* 给一个对象绑定事件处理函数的第一种形式(赋值形式)
* obj.onclick = fn
* 第二种形式,给一个对象的同一个事件绑定多个不同函数
* 兼容:
* ie
* obj.attachEvent(事件名称,事件函数)
* 1:没有捕获
* 2:事件名称+on
* 3:事件函数执行的顺序,标准ie正序,非标准ie倒序
* 4:this指向window
* 标准
* obj.addEventListener(事件名称,事件函数,是否捕获)
* 默认为false,true
* 1:有捕获
* 2:事件名称没有on
* 3:事件之行的顺序为正序
* 4:this触发该事件的对象
*
* call 函数下的第一个方法,call方法第一个参数可以改变函数执行过程中this的指向,第二个参数开始就是原来函数的参数列表
*/
/*oBtn.onclick = function(ev){
var ev = ev || event;
ev.cancleBubble = true;
}*/
/*function fn1(){
alert(1);
}
function fn2(){
alert(2);
}
document.addEventListener('click',fn1,false);
document.addEventListener('click',fn2,false);*/
// 解决方法
function bind(obj,evname,fn){
if(obj.addEventListener){
obj.addEventListener(evname,fn,false);
}else{
obj.attachEvent('on'+evname,function(){
fn.call(obj);
})
}
}
</script>
事件流及事件冒泡
最新推荐文章于 2022-08-29 16:22:47 发布