js事件中的event对象
addEvent(oDiv,"click",function(event){
console.log(event.bubbles+"事件是否冒泡");
console.log(event.cancelable +"是否可以取消默认行为")
console.log(event.defaultPrevented+"DOM3新增,是否已经调用了preventDefault()");
console.log(event.target);//+"当前发生事件的对象"@ IE中为 event.srcElement
console.log(event.currentTarget)//+"绑定的事件对象"
console.log(event.detail)//与事件相关的细节信息(不知道有什么用。。)
console.log(event.type);//发生了什么事件
console.log(event.eventPhase);//用于判断事件是否是冒泡进来的:返回1:表示捕获阶段;2表示处于目标;3表示冒泡进来的
event.preventDefault();//阻止默认事件@ IE8及以下 中函 直接在函数中return false
event.stopPropagation();//阻止冒泡@ IE8及以下 中 event.cancelBubble=true;
console.log(eventFn.getTarget(event));
});
function addEvent(obj,ev,fn){
if(obj.attachEvent)
{
obj.attachEvent("on"+ev,fn);
}
else
{
obj.addEventListener(ev,fn,false);
}
}
event.srcElement是IE下的属性
event.target是Firefox下的属性
Chrome浏览器同时有这两个属性 -------------------------------------------------------
兼容的event对象 冒泡 阻止默认事件。。 用法
eventFn.getTarget(event)
var eventFn = {
getEvent:function(event){
return event?event:window.event;
},
getTarget:function(event){
return event.target||event.srcElement;
},
preventDefault:function(event){
//阻止默认事件
if(event.preventDefault())
{
event.preventDefault();
}
else
{
event.returnValue = false;
}
},
stopPropagation:function(event){
//阻止冒泡
if(event.stopPropagation())
{
event.stopPropagation();
}
else
{
event.cancelBubble = true;
}
}
}
js事件中的event对象的更多相关文章
- JS中的event 对象详解
JS中的event 对象详解 JS的event对象 Event属性和方法:1. type:事件的类型,如onlick中的click:2. srcElement/target:事件源,就是发生事件的 ...
- Node.js 事件循环(Event Loop)介绍
Node.js 事件循环(Event Loop)介绍 JavaScript是一种单线程运行但又绝不会阻塞的语言,其实现非阻塞的关键是“事件循环”和“回调机制”.Node.js在JavaScript的基 ...
- JS事件中的对象
在触发任何事件时都会产生一个对象.如:DOM事件,window事件等,都会产生一个对象,该对象就是当前元素的事件对象. DOM事件对象 <body> <input type=&quo ...
- js中的Event对象
event代表事件的状态,例如触发event对象的元素,鼠标的位置及状态,按下的键等等 event对象只在事件发生的过程中才有效. <!DOCTYPE html><html lang ...
- js中window.event对象
event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromEleme ...
- js事件循环机制(Event Loop)
javascript从诞生之日起就是一门 单线程的 非阻塞的 脚本语言,单线程意味着,javascript代码在执行的任何时候,都只有一个主线程来处理所有的任务,非阻塞靠的就是 event lo ...
- js事件中绑定另一事件导致事件多次执行
1.html代码 <input type="button" value="add"> <input type="button&quo ...
- 理解js事件循环(event loop)
队列:先进先出 栈:后进先出 javascript的Event Loop 和 Node.js的Event Loop 区别: js(运行在浏览器),有主线程.异步任务队列的概念: node.js使用li ...
- 关于onclick中的event对象和element对象
event.srcElement:引发事件的目标对象,常用于onclick事件. event.fromElement:引发事件的对象源,常用于onmouseout和onmouseover事件. eve ...
随机推荐
- 手机自动化测试培训:appium目录结构分析
手机自动化测试培训:appium目录结构分析 移动端的自动化测试越来越普遍,poptest率先退出移动端自动化测试的课程,以appuim的python脚本版本作为授课基础,后期陆续退出java版本 ...
- 微信小程序首页总结
效果图如下 首先从大的方面来讲,就是设置了window的属性 "navigationBarBackgroundColor": "#AFE2E6",//bar ...
- 9.Linux系统引导流程
一.Linux系统引导流程 当我们按下主机电源键的那时候开始,主板上的CMOS/BIOS模块将进行固件自检,以此检查各个硬件是否正确连接. 在Linux引导流程中,一般可以分为以下几个主要过程: 1. ...
- MongoDB基础教程系列--第七篇 MongoDB 聚合管道
在讲解聚合管道(Aggregation Pipeline)之前,我们先介绍一下 MongoDB 的聚合功能,聚合操作主要用于对数据的批量处理,往往将记录按条件分组以后,然后再进行一系列操作,例如,求最 ...
- webpack 打包成功,但是css不起作用
问题: webpack 打包成功,但是css不起作用 问题分析/解决: 原因有以下几种 使用了webpack2的语法规则不正确; webpack2要求必须写-loader; 可能是只写了css-loa ...
- 111_climbing-stairs
/*@Copyright:LintCode@Author: Monster__li@Problem: http://www.lintcode.com/problem/climbing-stair ...
- Linux防火墙配置—SNAT1
1.实验目标 以实验"防火墙配置-访问外网WEB"为基础,在WEB服务器上安装Wireshark,设置Wireshark的过滤条件为捕获HTTP报文,在Wireshark中开启捕获 ...
- ArrayList 如何完美去除空值
package sourceCode.ArrayList; import java.util.ArrayList; import java.util.List; public class arrayL ...
- html基础认识,高手别看
HTML5是一种用于在万维网上构建和呈现内容的符号言语.它是HTML规范的第五和当时版别.它是由万维网联盟(W3C)在十月发布的2014 [ 2 ] [ 4 ]和最新的多媒体支持进步言语,一起坚持它简 ...
- python在接口测试的实际应用
今天看到@51Testing软件测试网 关于"关于接口测试的总结"的文章,进去浏览了一下,文章主要是针对接口测试的理论性的描述,而实战的内容没有涉及到.刚好今天我将我的系列文章的& ...