Event学习 Event浏览器兼容性

界面事件(Interface events)

界面事件不是被用户动作触发的,而是被用户行为结果触发。
      用户在任何元素上单击都会触发一个click时间。当点击发生在有特殊含义的元素上的时候,额外的界面事件就会被触发。
      例如,当用户在一个链接上单击就触发了click时间。单击这个链接一个新的页面就会被装载,所以这个特殊的click事件导致了界面事件unload的触发。
      其他的界面事件还有resize,scroll和focus/blur。

鼠标事件(mouse events)

从Netscape 2开始,所有的浏览器都注意到了这样两个事实。当鼠标划入一个链接区域,那么mouseover事件就触发了。当他点击了这个链接那么click事件触发。不久之后mouseout也被添加了进去,他会在鼠标离开链接区域的时候触发。因此传统的鼠标事件三合会(Traditional Triad)成立了。
      第三代的浏览器对于鼠标事件进行了一些扩充。dbclick添加了进来,click事件分割成了mousedown和mouseup:用户按下和弹起鼠标按键。最后跟踪鼠
标轨迹的mousemove也变成了可能
      在后面的章节会详细讲解鼠标事件(mouse event)。

表单事件(Form events)

表单能够识别submit和reset事件,submit在用户提交表单的时候触发reset在重置表单的时候触发。其中submit事件是所有表单验证代码的核心。当用户提交表单的时候,就遍历一遍表单检查是否有不正确的数据。如果发现了一个错误,停止提交表单并向用户发出一个警告。
      表单还能在某一项得到或者失去焦点的时候识别focus和blur事件,还有键盘事件和click事件。可以查看其他的兼容性列表。
      一般情况下使用这些事件的时候要小心。当用户离开表单中的某一项的时候完全可以用onblur来验证数据,但是通常这都很烦人。用户在忙着填表单的时候不想看见任何弹出来的提示。

W3C事件(W3C events)

在W3C的DOM 2 事件规范中  还定义了一些突发事件(Mutation events)。这些事件在文档的DOM结构发生变化的时候触发。最常见的一个就是DOMSubtreeModified事件,它会在DOM发生变化的时候触发。
      Mozilla将这个事件设置为subtreemodified。Mozilla也不支持其他的我们没有提到的w3c事件。

微软事件(Microsoft events)

微软创造了一大堆事件。有一些是非常有趣的。
      当用户在任何时候单击鼠标右键的时候就会触发comtextmenu事件。这非常有用以致滥用。Mozilla也支持这个事件。
      当导入XML文件的时候,readystatechange事件就像一些load事件一样提供服务。当XML文档的readyState变成4的时候,文档就加载完毕了。(不要问我什么是readyState,他管用而且够用)
      让人惊奇的是在unload事件发生之前还有beforeunload事件。他设计的目的是用来取消关闭页面,但是确没人在乎。
      最后微软还发明了mouseenter和mouseleave事件,这两个几乎和mouseover合mouseout事件一样。在鼠标事件一章查看。
      当然以上事件只被IE支持。

Mozilla事件(Mozilla events)

Mozilla,当然也有一大堆自己的事件。我还没有仔细的研究。

事件处理程序

所有的事件无论何时触发都会被浏览器检测到。浏览器通常也会执行默认的程序,就像当用户点击一个链接的时候。但是有时候什么也不会发生。

事件处理程序的重点在于你可以让其他事情发生。你可以在事件发生的时候让浏览器执行你的脚本。如果你这样写了那么无论何时只要事件发生那么你的脚本就会执行。如果这些脚本在符合逻辑的基础上能非常的有用,那么你的用户也会非常的愉快。

为了确保你的脚本在事件触发的时候能够执行,你需要对HTML元素的确定的动作进行事件注册,就像下面这样:

<a href="somewhere.html" onClick="alert('I\'ve been clicked!')">.

这样脚本里的alert('I\'ve been clicked!')就会在click事件发生的时候执行。这就注册了一个
(0)

相关推荐

  • 前端教程:JavaScript事件

    JavaScript与HTML交互是通过在用户或浏览器操纵页面上发生的事件进行处理. 当页面加载,这是一个事件.当用户点击一个按钮,这一下,也就是一个事件.事件的另一个例子是类似按下任意键,关闭窗口, ...

  • JS-JavaScript事件详解

    JS运行和编译 语法分析 查找基本语法有没有错误 预解析 执行之前进行预解析 var.function关键字提前到当前作用域的顶部,变量默认值为undefined,函数默认值为函数体代码块,当函数与变 ...

  • [css] 第73天 在实际编写css中你有遇到过哪些浏览器兼容性的问题?怎么解决的?

    今日试题: 在实际编写css中你有遇到过哪些浏览器兼容性的问题?怎么解决的? 此开源项目四大宗旨:勤思考,多动手,善总结,能坚持 <论语>,曾子曰:"吾日三省吾身"(我 ...

  • 常见浏览器兼容性问题及解决方案

    不同浏览器的内核不尽相同,所以各个浏览器对网页的解析存在一定的差异. 浏览器内核主要分为两种,一是渲染引擎,另一个是js 引擎 所以浏览器兼容性问题一般指:css兼容.js兼容 五大浏览器 内核 Ch ...

  • 企业怎么样维护对浏览器兼容性非常重要?

    浏览器兼容性是前端工程师最头疼的问题,因为在不同的浏览器下浏览同一个页面可能会显示不同的效果 什么是网站兼容性?所谓网站兼容性,就是用不同的浏览器浏览同一个网站,显示出完全一样的效果和功能,所以网站可 ...

  • 新版edge浏览器兼容性视图设置在哪

    很多用户在使用新版edge浏览器的时候都会遇到的一个问题,就是想要进行兼容性视图的设置,让浏览器兼容其他搜索引擎服务,这样可以轻松的使用各种网页适配,但是很多用户不知道新版edge浏览器兼容性视图设置 ...

  • 浏览器的 Event Loop

    前端技术优选 昨天 以下文章来源于掘金开发者社区 ,作者小蘑菇哥哥 掘金开发者社区 掘金,一个帮助开发者成长的技术社区 前端技术优选 为你精选前端领域优质技术博文,欢迎关注. 57篇原创内容 公众号 ...

  • Event Bus 设计模式学习笔记

    原文:Design Patterns: Event Bus Motivation 想象一下,有一个包含大量相互交互的组件的大型应用程序,并且您想要一种方法使您的组件进行通信,同时保持松散耦合和关注点分 ...

  • TPAMI 2021 :基于 event stream 的步态识别,准确率高达90%!

    作者丨张贤同学 审稿丨邓富城 编辑丨极市平台 极市导读 本文介绍了作者被TPAMI接收的工作,基于 event stream 的两种不同表示形式,提出了一种新的基于 event stream 的步态识 ...

  • LIT.EVENT|世界读书日,故事从一杯咖啡开始

    文穴线上&线下双活动 4.23世界读书日 4.24文穴杭州书友面基日 活动一:4.23世界读书日知识竞赛 为了让大家的阅读生活更加有趣,文穴联合新民说推出了线上读书日知识竞赛活动,在阅读群内以 ...

  • python笔记12-python多线程之事件(Event)

    前言 小伙伴a,b,c围着吃火锅,当菜上齐了,请客的主人说:开吃!,于是小伙伴一起动筷子,这种场景如何实现 一. Event(事件) Event(事件):事件处理的机制:全局定义了一个内置标志Flag ...