zoukankan      html  css  js  c++  java
  • JQUERY 键盘事件

    一、首先需要知道的是:

    1、keydown()
    keydown 事件会在键盘按下时触发。

    2、keypress()
    keypress 事件会在敲击按键时触发,我们可以理解为按下并抬起同一个按键。

    3、keyup()
    keyup 事件会在按键释放时触发,也就是你按下键盘起来后的事件。

    二、获得键盘上对应的 ascII 码:

    1
    2
    3
    4
    //键码获取
    $(document).keydown(function (event) {
        alert(event.keyCode);
    });

    上面例子中,event.keyCode 就可以帮助我们获取到我们按下了键盘上的什么按键,他返回的是 ascII 码,比如说上下左右键,分别是38,40,37,39;

    三、实例:

    比如:小说网站中常见的按左右键来实现上一篇文章和下一篇文章;
    按 ctrl+enter 实现表单提交(以此提高用户体验);
    如果我们要实现 ctrl+enter 提交表单,可以这样:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    //键盘操作
    $(document).keydown(function (event) {
        if (event.ctrlKey && event.keyCode == 13) {
            alert('Ctrl+Enter');
        };
        switch (event.keyCode) {
        case 37:
            alert('方向键-左');
            break;
        case 39:
            alert('方向键-右');
            break;
        };
        return false;
    });
    四、键盘对应的ASCII码
    ESC键 VK_ESCAPE (27)
    回车键: VK_RETURN (13)
    TAB键: VK_TAB (9)
    Caps Lock键: VK_CAPITAL (20)
    Shift键: VK_SHIFT ($10)
    Ctrl键: VK_CONTROL (17)
    Alt键: VK_MENU (18)
    空格键: VK_SPACE ($20/32)
    退格键: VK_BACK (8)
    左徽标键: VK_LWIN (91)
    右徽标键: VK_LWIN (92)
    鼠标右键快捷键:VK_APPS (93)
    ------------------------------------
    Insert键: VK_INSERT (45)
    Home键: VK_HOME (36)
    Page Up: VK_PRIOR (33)
    PageDown: VK_NEXT (34)
    End键: VK_END (35)
    Delete键: VK_DELETE (46)

    方向键(←): VK_LEFT (37)
    方向键(↑): VK_UP (38)
    方向键(→): VK_RIGHT (39)
    方向键(↓): VK_DOWN (40)

    -----------------------------------
    F1键: VK_F1 (112)
    F2键: VK_F2 (113)
    F3键: VK_F3 (114)
    F4键: VK_F4 (115)
    F5键: VK_F5 (116)
    F6键: VK_F6 (117)
    F7键: VK_F7 (118)
    F8键: VK_F8 (119)
    F9键: VK_F9 (120)
    F10键: VK_F10 (121)
    F11键: VK_F11 (122)
    F12键: VK_F12 (123)

    ---------------------------------

    Num Lock键: VK_NUMLOCK (144)
    小键盘0: VK_NUMPAD0 (96)
    小键盘1: VK_NUMPAD0 (97)
    小键盘2: VK_NUMPAD0 (98)
    小键盘3: VK_NUMPAD0 (99)
    小键盘4: VK_NUMPAD0 (100)
    小键盘5: VK_NUMPAD0 (101)
    小键盘6: VK_NUMPAD0 (102)
    小键盘7: VK_NUMPAD0 (103)
    小键盘8: VK_NUMPAD0 (104)
    小键盘9: VK_NUMPAD0 (105)
    小键盘.: VK_DECIMAL (110)
    小键盘*: VK_MULTIPLY (106)
    小键盘+: VK_MULTIPLY (107)
    小键盘-: VK_SUBTRACT (109)
    小键盘/: VK_DIVIDE (111)
    Pause Break键: VK_PAUSE (19)
    Scroll Lock键: VK_SCROLL (145)

    -------------------------------------

    0x1 鼠标左键
    0x2 鼠标右键
    0x3 CANCEL 键
    0x4 鼠标中键
    0x8 BACKSPACE 键
    0x9 TAB 键
    0xC CLEAR 键
    0xD ENTER 键
    0x10 SHIFT 键
    0x11 CTRL 键
    0x12 MENU 键
    0x13 PAUSE 键
    0x14 CAPS LOCK 键
    0x1B ESC 键
    0x20 SPACEBAR 键
    0x21 PAGE UP 键
    0x22 PAGE DOWN 键
    0x23 END 键
    0x24 HOME 键
    0x25 LEFT ARROW 键
    0x26 UP ARROW 键
    0x27 RIGHT ARROW 键
    0x28 DOWN ARROW 键
    0x29 SELECT 键
    0x2A PRINT SCREEN 键
    0x2B EXECUTE 键
    0x2C SNAPSHOT 键
    0x2D INSERT 键
    0x2E DELETE 键
    0x2F HELP 键
    0x90 NUM LOCK 键

    -----------------------------------------

    A 至 Z 键与 A – Z 字母的 ASCII 码相同:
    值 描述
    65 A 键
    66 B 键
    67 C 键
    68 D 键
    69 E 键
    70 F 键
    71 G 键
    72 H 键
    73 I 键
    74 J 键
    75 K 键
    76 L 键
    77 M 键
    78 N 键
    79 O 键
    80 P 键
    81 Q 键
    82 R 键
    83 S 键
    84 T 键
    85 U 键
    86 V 键
    87 W 键
    88 X 键
    89 Y 键
    90 Z 键
    ------------------------------------------
    0 至 9 键与数字 0 – 9 的 ASCII 码相同:
    值 描述
    48 0 键
    49 1 键
    50 2 键
    51 3 键
    52 4 键
    53 5 键
    54 6 键
    55 7 键
    56 8 键
    57 9 键
    ----------------------------------------
    下列常数代表数字键盘上的键:
    值 描述
    0x60 0 键
    0x61 1 键
    0x62 2 键
    0x63 3 键
    0x64 4 键
    0x65 5 键
    0x66 6 键
    0x67 7 键
    0x68 8 键
    0x69 9 键
    0x6A MULTIPLICATION SIGN (*) 键
    0x6B PLUS SIGN (+) 键
    0x6C ENTER 键
    0x6D MINUS SIGN (–) 键
    0x6E DECIMAL POINT (.) 键
    0x6F DIVISION SIGN (/) 键
    ----------------------------------------------
    下列常数代表功能键:
    值 描述
    0x70 F1 键
    0x71 F2 键
    0x72 F3 键
    0x73 F4 键
    0x74 F5 键
    0x75 F6 键
    0x76 F7 键
    0x77 F8 键
    0x78 F9 键
    0x79 F10 键
    0x7A F11 键
    0x7B F12 键
    0x7C F13 键
    0x7D F14 键
    0x7E F15 键
    0x7F F16 键
     
  • 相关阅读:
    9.11 eventbus
    9.10,,,实现new instanceof apply call 高阶函数,偏函数,柯里化
    9.9 promise实现 写完了传到gitee上面了,这里这个不完整
    9.5cors配置代码
    9.5 jsonp 实现
    9.5 http tcp https总结
    9.3 es6 class一部分 and es5 class 发布订阅
    8.30 cookie session token jwt
    8.30vue响应式原理
    warning: LF will be replaced by CRLF in renard-wx/project.config.json. The file will have its original line endings in your working directory
  • 原文地址:https://www.cnblogs.com/mracale/p/5671688.html
Copyright © 2011-2022 走看看