JavaScript高级程序设计47.pdf

触摸设备

iOS和Android设备的实现非常特别，因为这些设备没有鼠标，在面向iPhone和iPod中的Safari开发时，要记住以下几点

不支持dblclick事件，双击浏览器窗口会放大画面，没有办法改变该行为

轻击可单击元素会触发mousemove事件，如果此操作导致内容的变化，将不再有其他事件发生；如果屏幕没有发生变化，那么会依次发生mousedown、mouseup和click事件。轻击不可单击的元素不会触发任何事件（可单击元素指链接或指定了onclick事件处理程序的元素）

mousemove事件也会触发mouseover和mouseout事件

两个手指放到屏幕上，页面随手指移动而滚动时会触发mousewheel和scroll事件

无障碍性问题

考虑到使用屏幕阅读器的视障用户，不建议使用click之外的其他鼠标事件来展示或引发代码执行（click可以通过键盘触发）

键盘与文本事件

“DOM3级事件”有3个键盘事件

keydown:按下键盘上的任意键触发，按住不放则会重复触发事件

keypress:按下键盘上的字符键触发，按住不放则会重复触发事件，按下Esc键也会触发。Safari3.1之前的版本按下非字符键也触发keypress

keyup:释放键盘上的键时触发

所有元素支持这3个事件，但通过文本框输入文本时才最常用到

有一个文本事件textInput，这个事件是对keypress的补充，在文本插入文本框之前会触发textInput事件，更容易拦截文本

按一下字符键会触发keydown事件→keypress事件→keyup事件，keydown和keypress在文本框变化之前被触发，keyup在文本框变化之后触发，按住一个字符键不放，重复触发keydown和keypress事件

按下一个非字符键keydown→keyup，按住不放重复触发keydown事件，直到松开触发keyup事件

键盘事件与鼠标事件一样，支持修改建shiftKey、ctrlKey、altKey和metaKey属性，IE不支持metaKey

键码

发生keyown和keyup事件时，event对象keyCode属性会包含一个代码，与键盘的一个特定键对应，DOM和IE的event对象都支持keyCode属性

字符编码

keypress事件意味着按下的键会影响屏幕中文本的显示，在所有浏览器中，按下能够插入或删除的字符的键都会触发keypress事件，其他键是否触发因浏览器而异

IE9、Firefox、Chrome和Safari的event对象都支持一个charCode属性，包含字符代表的ASCII编码，IE8及之前的版本和Opera则是在keyCode中保存ASCII编码，跨浏览器：

var EventUtil={

　　　　//省略的代码

　　　　getCharCode:function(event){

　　　　　　if(typeof event.charCode=="number"){

　　　　　　　　return event.charCode;

　　　　　　}else{

　　　　　　　　return event.keyCode;

　　　　　　}

　　　//省略的代码

　　};

取得了字符编码之后，就可以使用String.fromCharCode()将其转换为实际的编码

DOM3级变化（本小节内容不推荐使用）

DOM3级事件中的键盘事件不再包含charCode属性，而是包含两个新属性key和char

key属性取代了keyCode，它的值是一个字符串，在按下某个字符键时，key的值就是相应的文本字符，按下非字符键时，key的值是相应键的名（如“shift”）；char属性在按下字符键时行为相同，按下非字符键值为null

IE9支持key属性，不支持char属性；Safari 5和Chrome支持名为keyIdentifier的属性，在按下非字符键（如“shift”）情况下，与key的值相同，对于字符键，keyIdentifier返回一个格式类似“U+0000”的字符串，表示Unicode值

DOM3级事件还添加了一个名为location的属性，是一个数值，表示按下了什么位置上的键：

0表示默认键盘，1表示左侧键盘（如左侧shift），2表示右侧键盘，3表示数字小键盘，4表示移动设备键盘（虚拟键盘），5表示手柄（任天堂Wii控制器）

最后给event对象添加了getModifierState()方法，接收一个参数（Shift、Control、AltGraph或Meta字符串），表示要检测的修改键，如果键是活动的（按下状态），返回true否则返回false

textInput事件

用户在可编辑区域中输入字符时，就会触发这个事件，与keypress的不同是：

任何可以获得焦点的元素都可以触发keypress事件，可编辑区域才能触发textInput事件；

按下那些能够影响文本显示的键（如退格键）也会触发keypress事件，按下能够输入实际字符的键才会被触发textInput事件。

textInput事件的event对象还包含一个data属性，这个属性就是用户输入的字符（非字符编码），按下“s”则显示“s”，按下“S”则显示“S”

此外event对象还有一个属性，叫inputMethod，表示把文本输入到文本框的方式

0：表示浏览器不确定是怎么输入的

1：表示使用键盘输入的

2：表示粘贴进来的

3：表示拖放进来的

4：表示使用IME输入的

5：表示通过在表单中选择某一项输入的

6：表示手写输入（手写笔）

7：表示语言输入

8：表示几种方式组合输入

9：表示通过脚本输入

支持textInput属性的有IE9+、Safari和Chrome，只有IE支持inputMethod属性

巴特西

JavaScript高级程序设计47.pdf

最新文章

热门文章