Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。

事件通常与函数结合使用,函数不会在事件发生前被执行!

一:测试按键

  1. function whichButton(event){
  2.   var btnNum = event.button;
  3. if (btnNum==2){
      alert("您点击了鼠标右键!")
  4. }
  5. else if(btnNum==0)
  6. {
  7. alert("您点击了鼠标左键!")
  8. }
  9. else if(btnNum==1)
  10. {
  11. alert("您点击了鼠标中键!");
  12. }
  13. else
  14. {
  15. alert("您点击了" + btnNum+ "号键,我不能确定它的名称。");
  16. }
  17. }

二:获取鼠标坐标

  1. function show_coords(event)
  2. {
  3.   x=event.clientX;
  4.   y=event.clientY;
  5.   alert("X 坐标: " + x + ", Y 坐标: " + y)
  6. }

  

三:获取 键盘 按键的 unicode

  1. function whichButton(event)
  2. {
  3.   alert(event.keyCode);
  4. }

  

四:相对于屏幕的 鼠标 坐标

  1. function coordinates(event)
  2. {
  3.   x=event.screenX;
  4.   y=event.screenY;
  5.   alert("X=" + x + " Y=" + y);
  6. }

  

五:shift 按键是否被  按住

  1. function isKeyPressed(event)
  2. {
  3. if (event.shiftKey==1)
  4. {
  5.   alert("The shift key was pressed!")
  6. }
  7. else
  8. {
  9.   alert("The shift key was NOT pressed!")
  10. }
  11. }

  

六:测试 点击了 何种元素(p,div,或者 image,a and so on.)

  1. function whichElement(e)
  2. {
  3.   var targ
  4.   if (!e) var e = window.event
  5.   if (e.target) targ = e.target
  6.   else if (e.srcElement) targ = e.srcElement
  7.   if (targ.nodeType == 3); // defeat Safari bug
  8. targ = targ.parentNode
  9.   var tname
  10.   tname=targ.tagName
  11.   alert("You clicked on a " + tname + " element.");
  12. }

  

Dom EVENT对象的更多相关文章

  1. HTML DOM Event对象

    我们通常把HTML DOM Event对象叫做Event事件 事件驱动模型 事件源:(触发事件的元素)事件源对象是指event对象 其封装了与事件相关的详细信息. 当事件发生时,只能在事件函数内部访问 ...

  2. 浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Event 对象

    ylbtech-浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Event 对象 1.返回顶部 1. HTML DOM Event 对象 实例 哪个鼠标按钮被点击 ...

  3. 框架中的HTML DOM Event 对象

    js中的this上下文会因事件而转换成html dom对象. 所以就有这样获取当前触发事件的dom对象: window.event.srcElement || window.event.target; ...

  4. HTML DOM Event 对象

    var event;if (document.createEvent){event = document.createEvent("HTMLEvents");event.initE ...

  5. JavaScript学习笔记(11)——HTML DOM Event对象

    w3cshool:时间参考手册:http://www.w3school.com.cn/jsref/dom_obj_event.asp

  6. DOM中Event 对象如何使用

    DOM中Event 对象如何使用 一.总结 一句话总结: 1.将event作为参数传递进来,然后就可以调用event对象的各种属性和方法了. <body onmousedown="wh ...

  7. 【前端】原生event对象和jquery event对象的区别

    标准DOM event对象转换成 jQuery event对象 $(event) jQuery event对象转换成 标准DOM event对象 event.originalEvent

  8. event 对象 小记

    event对象的属性提供了有关事件的细节并且通过event对象的方法,可以控制事件的继续传播和阻止事件的默认行为 2级DOM Events 标准定义了一个标准的事件模型  被除了IE外的所有现代浏览器 ...

  9. dom事件与event对象总结

    1 事件:就是文档或浏览器窗口中发生的一些特定的交互瞬间.    tips:js和xhtml的交互是通过当用户或浏览器操作网页时发生的事件来处理的. 1.1 事件流:即事件的顺序.        事件 ...

随机推荐

  1. 【转】Pro Android学习笔记(三):了解Android资源(上)

    在Android开发中,资源包括文件或者值,它们和执行应用捆绑,无需在源代码中写死,因此我们可以改变或替换他们,而无需对应用重新编译. 了解资源构成 参考阅读Android学习笔记(三八):资源res ...

  2. eclipse修改workspace

    Eclipse是一款很强的Java IDE,我们在开始的时候,往往设定了默认的workspace,当用久在之后,我们可能要去更改一下workspace的位置,但是在启动的时候已经不会显示更改了.下面有 ...

  3. IIS 6.0曝远程代码执行漏洞CVE-2017-7269

    一.漏洞说明 漏洞编号:CVE2017-7269 影响中间件:IIS6.0 影响服务器版本:windows 2003 R2 二. 环境搭建 虚拟机kali : 192.168.1.2 靶机window ...

  4. Elastic-job使用及原理

    一.原理 elastic-job有lite版和cloud版,最大的区别是有无调度中心,笔者采用的是lite版本,无中心化. tips: 第一台服务器上线触发主服务器选举.主服务器一旦下线,则重新触发选 ...

  5. 跟我学: 使用 fireasy 搭建 asp.net core 项目系列之一 —— 开篇

    ==== 目录 ==== 跟我学: 使用 fireasy 搭建 asp.net core 项目系列之一 —— 开篇 跟我学: 使用 fireasy 搭建 asp.net core 项目系列之二 —— ...

  6. c# new三种用法

    前几天去家公司面试,有一道这样的题:写出c#中new关键字的三种用法,思前想后挖空心思也只想出了两种用法,回来查了下msdn,还真是有第三种用法:用于在泛型声明中约束可能用作类型参数的参数的类型,这是 ...

  7. Vue实现选项卡效果

    <!DOCTYPE html> <html lang="en"> <head>    <meta charset="UTF-8& ...

  8. js原型和构造函数

    前言 从应用层面深入理解原型模式和js中的构造函数. 构造函数(constructor) js中的任何对象都有自己的构造函数.js中使用字面量声明的普通对象({})或数组([])等子对象本质上都是使用 ...

  9. PJzhang:一站式跨境卖家网址导航Amz520.com

    猫宁!!! 参考链接:http://www.guxiaobei.com/amz520-release.html www.amz520.com是一个跨境电商导航站点,汇集了大量的高效信息,做这个站点花费 ...

  10. 第七篇 .NET高级技术之关于相等 Equals

    查看判断两个对象是否是同一个对象要用:object.ReferenceEquals(); 因为“==”默认值是比较两个对象是不是同一个对象.所以有时候两个对象的内容相等,但是比较后还是false. O ...