键盘与文本事件

《javascript高级程序设计》 13.4.4  ---键盘与文本事件  笔记

1、键盘事件

  1. 有3个键盘事件

     keydown  当用户按下键盘上的任意键时触发，并且若是按住不放的话。会重复触发此事件

     keypress   当用户按下键盘上的字符键时触发，并且若是按住不入的话，会重复触发此事件、按下Esc键也会触发这个事件。Safari3.1以前的版本也会在用户按下非字符键时触发些事件

    keyup  当用户释放键盘的时触发

  2. 有一个文本事件

    textInput  是对keypress的补充，用意是将文本显示给用户以前更容易拦截文本，在文本插入文本框以前就能触发textInput事件

  3. 在用户按下键盘上的字符键时，会依次触发 keydown ---> keypress ---> keyup ;   keydown,keypress都是在文本框发生变化以前触发的，keyup是在文本框变化以后触发的,当用户按住一个键不放时，会重复触发keydown与keypress事件

    在键盘上按下一个非字符键时，会依次触发keydown --->  keyup 若是按住非字符键不放，会重复触发keydown事件

4. 键盘事件支持修改键 shiftKey,ctrlKey,altKey,metaKey(IE不支持)

 

2、键盘事件其余信息

  1.  键码  在发生keydown,keyup事件时，event对象的keyCode属性会包含一个代码。与sfhift键的状态无关

      keypress事件对象中没有keyCode属性

  2. 字符编码  发生keypress事件，DOM3级事件规范，event对象中有一个charCode属性。这个属性只有在发生keypress事件时才包含值，并且这个值是按下的那个键所表明字符的ASCII编码

  3.  DOM3级变化

     DOM3级键盘事件再也不包含charCode属性，而是包含两个key与char属性

     key  是为了取代keyCode，返回的是一个字符串，在按下某个字符键时，key的值就是相应的文本字符，在按下非字符键时，就是相应键的名。

    char  行为与key相同，但按下非字符键时的值为null

   IE9+支持key属性，但不支持char属性， safari5+ 与chrome支持名为keyIdentifier的属性，在按下非字符键的状况下与key的值相同，对于字符键，keyIdentifier返回一个格式相似U+0000的字符串，表示Unicode值

  location属性，是一个数值，表示按下了什么位置上的键

      0 ---- 默认键盘   1 ---  左侧位置（左位的Alt键）   2 ---- 右侧位置（右侧的Shift键）   3 ---- 数字小键盘

      4 ---- 移动设备键盘（虚拟键盘）  5 ---- 手柄（如任天堂Wii控制器）

      IE9支持这个属性 safari与chrome支持名为keyLocation的等价属性。但即有Bug  值始终是0  除非按下了数字键盘（此时，值为3） ，不然，不会是一、二、四、5  （chrome30,ff 支持 DOM的location，opera16,safari5.17不支持)

   getModifierState()方法，接受一个参数，即Shift,Control,AltGraph,Meta的字符串，表示要检测的修改键，若是处于被按下的状态，会返回true，不然为false（IE9+，chrome30,FF24支持,safari5.1.7,opera16不支持）

 

3、文本事件

  textInput事件，当用户在可编辑区域中输入字符时，就会触发这个事件，与keypress的区别在于

   1.  textInput只能在可编辑区域才能触发，keypress能够在任意可获得焦点的元素上触发

   2.  textInput只会在用户按下可以输入实际字符的键时才会触发，keypress在按下那些可以影响文本显示的键时也会触发（例如退格键）

textInput事件的event对象有一个data属性，这个属性的值就是用户输入的字符（不是字符编码）,与大小写有关

textInput事件的event对象有一个inputMethod属性，表示把文本输入到文本框中的方式

   0 ---- 浏览器不肯定是怎么输入的      1 ------ 使用键盘输入的                  2 ---- 文本是粘贴进来的

   3 ---- 文本是拖放进来的        4 ------ 文本是使用IME输入的         5 ---- 文本是经过在表单中选择某一项输入的

    6 ---- 文本是经过手写输入的   7 ----- 文本是经过语言输入的          8 ----  文本是经过几种方法组合输入的

   9 ------ 文本是经过脚本输入的

  只有IE支持inputMethod