prototype使用学习手册指南之event.js

  键盘事件包括keydown、kepress和keyup三种,每次敲击键盘都会(依次?)触发这三种事件,其中keydown和keyup是比较低级的接近于硬件的事件,通俗的理解是这两个事件可以捕获到你敲击了键盘中某个键;而keypress是相对于字符层面的较为高级点的事件,这个事件能够捕捉到你键入了哪个字符。可以这样理解,如果你敲击了A键,keydown和keyup事件只是知道你敲击了A键,它并不知道你敲的是大写的A(你同时按下了Shift键)还是敲的是小写a,它是以"键"为单位,你敲入了大写的A,它只是当成你敲下了shift和A两个键而已,但是keypress可以捕捉到你是敲入的大写的A还是小写的a.

  在介绍Prototype中Event对象前先介绍一下浏览器中的事件模型,浏览器中的事件主要有HTML事件、鼠标事件和键盘事件,前两种事件比较好理解,这里主要解释一下键盘事件以及它在IE和firefox中的区别.http://www.mlybyby.com

  还要理解一个概念是键盘中的键分为字符(可打印)键和功能键(不可打印),功能键包括Backspace, Enter, Escape, the arrow keys, Page Up, Page Down, and F1 through F12 等

  下面说一下键盘事件的具体使用方法,

  键盘事件的event对象中包含一个keyCode属性,IE中只有这一个属性,当为keydown和keyup 事件是,keycode属性表示你具体按下的键(也称为virtual keycode),当捕捉的是keypress事件时keyCode属性指的是你键入的字符(character code)

  在firefox中情况有些不同,event对象包含一个keyCode属性和一个charCode属性,keydown和keyup事件的时候,keyCode表示的就是你具体按的键,charCode为0;当捕捉的是keypress事件时,keyCode为0,charCode指的是你按下的字符

  当捕捉的是keypress事件时, 当你按的是可打印字符时,keyCode为0,charCode指的是你按下的字符的键值,当你按的是不可打印字符时,keyCode为按下的键的键值,charCode为0

  注意:功能键不会触发keypress事件,因为keypress对应的就是可打印的字符,但是有一点IE和FF 中的区别,你按下一个字符键的同时按下alt键,在IE中不触发keypress事件,但是在ff中可触发,我发现在IE中按下ctrl键的时候只有按下 q键会触发事件其他的要么不会触发事件,要么被浏览器IE自身捕获了,例如你按下ctrl_A,全选某个东西,你按ctrl_S保存文件,但是在FF中就 好多了,事件都是先传递到网页,再向外传递

  鉴于IE和FF中的区别,如果你比较懒的话,建议只使用keydow和keyup事件,这两种事件的使用在IE和FF中基本上没有区别,也不要捕获ctrl_A等被浏览器定义为快捷键的事件

  键盘事件event对象还有三个其他的属性altKey, ctrlKey, and shiftKey 来判断你按下一个键的时候是否按下了alt等键,这三个属性使用比较简单,三种事件都可以使用,也不存在ie和ff的兼容性问题

  在Prototype中的Event中又如下属性:

  KEY_BACKSPACE: 8,http://www.hrbfkyy120.com

  KEY_TAB: 9,

  KEY_RETURN: 13,

  KEY_ESC: 27,

  KEY_LEFT: 37,

  KEY_UP: 38,

  KEY_RIGHT: 39,

  KEY_DOWN: 40,

  KEY_DELETE: 46,

  KEY_HOME: 36,

  KEY_END: 35,

  KEY_PAGEUP: 33,

  KEY_PAGEDOWN: 34,

  以及下面的方法:

  element(event) :返回触发事件的元素

  isLeftClick(event) :判断是否按下的左键

  pointerX(event) :事件触发时鼠标的横坐标,对于非鼠标事件,在ff中没有此信息,但在ie中有?

  pointerY(event):事件触发时鼠标所在位置的纵坐标

  stop(event):阻止事件向上传播和浏览器的默认处理方法

  findElement(event, tagName) :找到触发事件的元素的所有祖先元素中的tagName为tagName的一个元素

  observe(element, name, observer, useCapture):注册事件处理函数

  stopObserving(element, name, observer, useCapture):撤销注册的事件

时间: 2024-11-05 23:19:16

prototype使用学习手册指南之event.js的相关文章

prototype使用学习手册指南之Position.js

Position是prototype中定义的一个对象,提供了操作DOM中与位置相关的方法,要很好的理解元素在页面中的位置,具体代码如下,按照代码说说,其中英文是作者的注释,中文的才是偶的说明或翻译英文的注释,采用顶式注释法(注释在要说明的代码的上面)说明 // set to true if needed, warning: firefox performance problems // NOT neeeded for page scrolling, only if draggable conta

Prototype使用学习手册指南之Selector.js

Prototype 中的Selector主要支持tag选择器.class选择器和id选择器,还有属性(attribute)选择器,Selector是利用css selector来匹配选择页面元素的,所以要理解Selector首先应该对css selector有所理解,下面是css2 selector的语法,当然很多浏览器只是支持其中的一部分,基本上包含我们平时所用的所有类型 The following table summarizes CSS2 selector syntax, 详细的可以看ht

菜鸟学习cordova-android的js源码(2)

刚刚数了一下,cordova.js中定义了17个模块,下面慢慢来看这17个模块. 先看比较独立的模块,一些工具模块. 1. cordova/urlutil 模块输出的对象包含一个方法makeAbsolute,把地址转化为绝对地址. //markdefine("cordova/urlutil", function(require, exports, module) { exports.makeAbsolute = function makeAbsolute(url) { var anch

ExtJS MVC学习手册 1

开发环境: ExtJS4.2 eclipse indigo 开发步骤说明 这次主要使用extjs4的mvc模式创建viewport.籍此初步了解mvc模式的结构. 下图为项目结构: 重点是app的目录结构: 其中controller.model.store.view一般来说是必须存在的目录. app.js是应用的引导页.需要在首页中显式调用. 如下是index.jsp的代码: 1: <%@ page language="java" pageEncoding="utf-8

KeyboardJS 开发指南 - 与 Three.js 配合使用的捕捉键盘组合键库

太阳火神的美丽人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 转载请保留此句:太阳火神的美丽人生 -  本博客专注于 敏捷开发及移动和物联设备研究:iOS.Android.Html5.Arduino.pcDuino,否则,出自本博客的文章拒绝转载或再转载,谢谢合作. A JavaScript library for binding keyboard combos without the pain of key

Web安全测试学习手册-业务逻辑测试

Web安全测试学习手册-业务逻辑测试 首先感谢朋友倾璇的邀请 http://payloads.online/archivers/2018-03-21/1 ,参与了<web安全测试学习手册>的相关撰写,目前负责业务逻辑测试这一块的撰写,目前初步已经成型,先发出来让大家看看,欢迎点评,也可以加入我们一起来撰写~ 业务逻辑测试 介绍:这里对Web应用业务逻辑方面的安全缺陷进行介绍和常见案例讲解. 任意用户密码重置 常见的缺陷 * 1.验证码类缺陷 -场景: 1.1 验证码回显在客户端(响应主体.Se

好程序员web前端学习路线分享web测试之Js中的函数

好程序员web前端学习路线分享web测试之Js中的函数,在JS中,一般使用函数其实就是为了封装某些操作,或者把编写的程序进行模块化的操作. 一.函数的声明方式 1.普通的函数声明 function box(num1, num2) { return num1+ num2; } 2.使用变量初始化函数 var box= function(num1, num2) { return num1 + num2; }; 3.使用Function构造函数 var box= new Function('num1'

SPA学习之 - 路由插件(crossroads.js)

Crossroads.js是一个受Rails, Pyramid, Django, CakePHP等基于路由/分发(Route/Dispatch)方式处理路由的后端MVC框架启发的一套js专业路由库.它能够直接解析传入的字符串并根据相应的规则来过滤和验证路由,然后再执行下一步的操作. A duck can walk, fly and swim, but he can’t do any of these things well… crossroads.js是一个独立的库功能十分强大和灵活,而且职责单

node.js在windows下的学习笔记(1)---安装node.js

1.首先打开http://www.nodejs.org/ 2.选择DOWNLOADS,跳转到下面的画面,我的系统是windows7的32位.所以选择.msi的32bit版本. 3.下载后,得到一个5.43MB大小的安装包, 4.运行安装包 点击next 打个勾,点击next 选择安装目录 最后,安装成功啦 node.js在windows下的学习笔记(1)---安装node.js,布布扣,bubuko.com