`
11510
  • 浏览: 836 次
  • 性别: Icon_minigender_1
  • 来自: 徐州
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

JS的event对象

阅读更多
Event属性和方法:

1. type:事件的类型,如onlick中的click;

2. srcElement/target:事件源,就是发生事件的元素;

3. button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下多个键,酒把这些值加起来,所以3就代表左右键同时按下;(firefox中 0代表左键,1代表中间键,2代表右键)

4. clientX/clientY:事件发生的时候,鼠标相对于浏览器窗口可视文档区域的左上角的位置;(在DOM标准中,这两个属性值都不考虑文档的滚动情况,也就是说,无论文档滚动到哪里,只要事件发生在窗口左上角,clientX和clientY都是 0,所以在IE中,要想得到事件发生的坐标相对于文档开头的位置,要加上
document.body.scrollLeft和 document.body.scrollTop)

5. offsetX,offsetY/layerX,layerY:事件发生的时候,鼠标相对于源元素左上角的位置;

6. x,y/pageX,pageY:检索相对于父要素鼠标水平坐标的整数;

7. altKey,ctrlKey,shiftKey等:返回一个布尔值;

8. keyCode:返回keydown何keyup事件发生的时候按键的代码,以及keypress 事件的Unicode字符;(firefox2不支持 event.keycode,可以用 event.which替代 )

9. fromElement,toElement:前者是指代mouseover事件中鼠标移动过的文档元素,后者指代mouseout事件中鼠标移动到的文档元素;

10. cancelBubble:一个布尔属性,把它设置为true的时候,将停止事件进一步起泡到包容层次的元素;(e.cancelBubble = true; 相当于 e.stopPropagation();)

11. returnValue:一个布尔属性,设置为false的时候可以组织浏览器执行默认的事件动作;(e.returnValue = false; 相当于 e.preventDefault();)

12. attachEvent(),detachEvent()/addEventListener(),removeEventListener:为制定 DOM对象事件类型注册多个事件处理函数的方法,它们有两个参数,第一个是事件类型,第二个是事件处理函数。在
attachEvent()事件执行的时候,this关键字指向的是window对象,而不是发生事件的那个元素;

13. screenX、screenY:鼠标指针相对于显示器左上角的位置,如果你想打开新的窗口,这两个属性很重要;


一些说明:

1.  event代表事件的状态,例如触发event对象的元素、鼠标的位置及状态、按下的键等等;

2.  event对象只在事件发生的过程中才有效。
firefox里的event跟IE里的不同,IE里的是全局变量,随时可用;firefox里的要用参数引导才能用,是运行时的临时变量。
在IE/Opera中是window.event,在Firefox中是event;而事件的对象,在IE中是 window.event.srcElement,在Firefox中是event.target,Opera中两者都可用。

3.  下面两句效果相同
var evt = (evt) ? evt : ((window.event) ? window.event : null);
var evt = evt || window.event; // firefox下window.event为null, IE下event为null

4.  IE中事件的起泡
IE中事件可以沿着包容层次一点点起泡到上层,也就是说,下层的DOM节点定义的事件处理函数,到了上层的节点如果还有和下层相同事件类型的事件处理函数,那么上层的事件处理函数也会执行。例如, div 标签包含了 a ,如果这两个标签都有onclick事件的处理函数,那么执行的情况就是先执行标签 a 的onclick事件处理函数,再执行 div 的事件处理函数。如果希望的事件处理函数执行完毕之后,不希望执行上层的 div 的onclick的事件处理函数了,那么就把cancelBubble设置为true即可。

来源:http://www.blogjava.net/baoyaer/articles/105864.html
分享到:
评论

相关推荐

    javascriptEvent对象详解定义.pdf

    javascript Event 对象详解定义 在 JavaScript 中,Event 对象是事件状态的代表,它包含了事件发生的元素、键盘状态、鼠标位置和鼠标按钮状态等信息。一旦事件发生,浏览器的内存中就会生成相应的 Event 对象,如...

    javascript Event对象详解

    JavaScript中的Event对象是事件处理的核心部分,它包含了与事件相关的所有信息,如事件类型、触发事件的元素、鼠标和键盘的状态等。以下是对Event对象及其重要属性的详细解释: 1. **altKey**:这个属性用于检查...

    《javascript》——event对象与事件

    《JavaScript》——Event 对象与事件 Event 对象是 JavaScript 中的一个基本概念,它代表了用户与 Web 页面的交互行为,例如点击、鼠标移动、键盘输入等。Event 对象的属性和方法可以帮助开发者更好地处理用户的...

    window对象--event对象详解

    Event对象则是JavaScript事件处理中的核心,它包含了与特定事件相关的所有信息,如事件类型、事件目标等。 在深入讲解Window对象和Event对象之前,我们先了解一些基础概念。JavaScript是一种基于原型的动态类型语言...

    JavaScript event对象整理及详细介绍

    JavaScript中的event对象是事件处理机制的核心,它为开发者提供了处理事件所需的属性和方法。以下是对JavaScript event对象的详细介绍,包括其属性、方法以及在不同浏览器中的兼容性问题。 首先,event对象包含了...

    javascript Event对象详解及使用示例

    JavaScript Event对象是前端开发中不可或缺的一部分,它允许开发者与用户界面进行交云,比如按钮点击、键盘按键、鼠标移动等。Event对象负责管理事件在页面上发生的各种状态,包括事件发生的元素、键盘状态、鼠标...

    js Event对象的5种坐标

    JavaScript中的Event对象是处理用户交互和页面事件时不可或缺的一部分,它包含了与事件相关的各种信息,如事件类型、触发事件的元素、鼠标位置等。在不同的浏览器中,Event对象提供的坐标属性不尽相同,这给开发者...

    window.event 对象详解

    在JavaScript编程语言中,`window.event`对象是一个特殊对象,它与浏览器的事件处理机制紧密相关。这个对象在大部分浏览器环境中(尤其是老版本的IE)是全局可用的,提供了当前事件的相关信息。本文将深入探讨`...

    [JS]详尽解析window.event对象

    `window.event`对象是JavaScript中一个非常重要的概念,特别是在处理DOM事件时。它代表了当前事件的状态和相关信息,包括触发事件的元素、鼠标位置、按键状态等。在事件发生时,`event`对象会作为参数传递给事件处理...

    Javascript中的事件--Event对象

    下面我们将深入探讨`Event`对象的关键属性和方法,以及它们在JavaScript中的应用。 ### 1. `Event`对象的基础属性 - **`type`**:表示事件的类型,例如`click`、`mousemove`等。 - **`target`**:返回事件最初触发...

    event对象总结,更详细更全面

    JavaScript 事件对象总结 事件对象概述 JavaScript 事件对象是指在用户与浏览器交互时触发的事件,例如点击、键盘输入、鼠标移动等。事件对象是一种特殊的对象,它包含了事件的详细信息,例如事件类型、事件目标、...

    一些常用的特效包括一些javascript中event对象的使用

    根据给定文件的信息,我们可以总结出以下几个...以上内容主要介绍了JavaScript中Event对象的使用以及如何通过事件来控制和优化用户输入体验。通过这些方法,开发者可以在网页应用中实现更高效、更精确的用户交互功能。

    js鼠标点击事件在各个浏览器中的写法及Event对象属性介绍

    接着,文章会介绍Event对象,这是JavaScript事件编程中的核心对象,包含了关于事件的各种信息,比如事件的类型、触发事件的元素以及事件发生时鼠标的具体位置等。现在让我们深入学习这些知识点。 首先,对于IE浏览...

    js中的event对象1

    在JavaScript中,`event`对象是处理事件时不可或缺的一部分... // 在这里可以访问并利用event对象的其他属性 }); ``` 通过以上方式,我们可以根据不同的事件类型和`event`对象的属性,实现高度定制化的用户交互体验。

    Event 对象的使用方法

    Event对象经常与JavaScript函数结合,用于响应用户的交互行为。 事件句柄,也称为事件处理器,是HTML 4.0引入的新特性,允许我们在HTML标签中定义事件触发的行为。这些行为会在特定的事件发生时执行,例如用户点击...

    HTML DOM Event 对象

    首先,Event对象是JavaScript中用于处理事件的核心组件。它包含了有关事件的各种信息,例如哪个鼠标按钮被点击、光标坐标、按键Unicode码等。例如,`event.button`属性可以用来判断哪个鼠标按钮被点击(1表示左键,2...

    让Firefox支持event对象实现代码

    if (arg0.constructor == Event) // 如果找到event对象 return arg0; } func = func.caller; } return null; } ``` 在上述示例中,`SearchEvent`会查找调用链上第一个具有`Event`类型的参数,从而找到事件...

Global site tag (gtag.js) - Google Analytics