zoukankan      html  css  js  c++  java
  • 键盘与文本事件

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

    一、键盘事件

      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不支持)

    二、键盘事件其他信息

      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) ,否则,不会是1、2、4、5  (chrome30,ff 支持 DOM的location,opera16,safari5.17不支持)

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

     

    三、文本事件

      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

  • 相关阅读:
    DGA域名可以是色情网站域名
    使用cloudflare加速你的网站隐藏你的网站IP
    167. Two Sum II
    leetcode 563. Binary Tree Tilt
    python 多线程
    leetcode 404. Sum of Left Leaves
    leetcode 100. Same Tree
    leetcode 383. Ransom Note
    leetcode 122. Best Time to Buy and Sell Stock II
    天津Uber优步司机奖励政策(12月28日到12月29日)
  • 原文地址:https://www.cnblogs.com/fsy0718/p/3355629.html
Copyright © 2011-2022 走看看