Đây là những gì tôi có bây giờ:

$("input").bind("keydown",function(e){
    var value = this.value + String.fromCharCode(e.keyCode);
}

Nếu e.keyCodecó thể không phải là một ký tự ASCII ( Alt, backspace, del, arrows., Vv) ... Tôi sẽ bây giờ cần phải trimnhững giá trị từ valuebằng cách nào đó (tốt nhất là lập trình - không phải với bảng tra cứu).

Tôi đang sử dụng jQuery.

Tôi phải sử dụng keydownsự kiện này. keyPresskhông kích hoạt cho một số phím tôi cần phải chụp ( Esc, del, backspace, vv).

Tôi không thể sử dụng setTimeoutđể có được giá trị đầu vào. setTimeout(function(){},0)quá chậm

Có thể tôi đã không hiểu chính xác câu hỏi, nhưng bạn không thể sử dụng keyupnếu bạn muốn nắm bắt cả hai đầu vào?

$("input").bind("keyup",function(e){
    var value = this.value + String.fromCharCode(e.keyCode);
});

Theo kinh nghiệm của tôi String.fromCharCode(e.keyCode)là không đáng tin cậy. String.fromCharCodemong đợi các mã charicode như là một đối số; e.keyCodetrả về mã khóa javascript. Mã khóa Javascript và mã charicode không giống nhau! Đặc biệt, các phím số và trả về một khác nhau keycodetừ các phím số bình thường (vì chúng là các phím khác nhau) trong khi cùng keycodeđược trả về cho cả hai uppervà lowercasechữ cái (bạn nhấn phím tương tự trong cả hai trường hợp), mặc dù họ có khác nhau charcodes.

Ví dụ: khóa số 1 thông thường tạo ra một sự kiện với keycode49 trong khi phím số 1 (có Numlockbật) tạo keycode97. Được sử dụng với String.fromCharCodechúng tôi nhận được như sau:

String.fromCharCode(49) returns "1"
String.fromCharCode(97) returns "a"

String.fromCharCodemong đợi mã charicode, không phải mã keyascript. Khóa atạo ra một sự kiện với keycode65, độc lập với trường hợp của ký tự mà nó sẽ tạo ra (cũng có một công cụ sửa đổi nếu Shiftnhấn phím, v.v. trong sự kiện). Nhân vật acó một unicode charcodelà 61 trong khi nhân vật Acó charcode41 (ví dụ, theo http://www.utf8-chartable.de/ ). Tuy nhiên, đó là hexcác giá trị, chuyển đổi thành số thập phân cho chúng ta charcode65 điểm cho "A" và 97 cho "a". [1] Điều này phù hợp với những gì chúng ta nhận được từ String.fromCharCodecác giá trị này.

Yêu cầu riêng của tôi là giới hạn xử lý số và chữ cái thông thường (chấp nhận hoặc từ chối tùy thuộc vào vị trí trong chuỗi) và cho phép các ký tự điều khiển ( F-key, -s Something Ctrl) thông qua. Do đó tôi có thể kiểm tra các ký tự điều khiển, nếu đó không phải là ký tự điều khiển tôi kiểm tra theo phạm vi và chỉ sau đó tôi mới cần lấy ký tự thực tế. Vì tôi không lo lắng về trường hợp (dù sao tôi cũng thay đổi tất cả các chữ cái thành chữ hoa) và đã giới hạn phạm vi mã phím, tôi chỉ phải lo lắng về các phím số. Những điều sau đây đủ cho điều đó:

String.fromCharCode((96 <= key && key <= 105)? key-48 : key)

Tổng quát hơn, một hàm để trả về ký tự một cách đáng tin cậy charcodesẽ rất tuyệt (có thể là một plugin jQuery), nhưng tôi không có thời gian để viết nó ngay bây giờ. Lấy làm tiếc.

Tôi cũng đề cập e.which(nếu bạn đang sử dụng jQuery), điều này sẽ bình thường hóa e.keyCodevà e.charCodedo đó bạn không cần phải lo lắng về việc loại phím nào được nhấn. Vấn đề với việc kết hợp nó với String.fromCharCodehài cốt.

[1] Tôi đã bối rối trong một thời gian -. tất cả các tài liệu nói rằng đều String.fromCharCodemong đợi một unicode charcode, trong khi trên thực tế, nó dường như hoạt động với các mã của ASCII, nhưng đó là do tôi cần phải chuyển đổi thành thập phân từ hex, kết hợp với thực tế là các mã charcode ASCII và các mã thập phân unicode trùng lặp thông thường chữ cái Latinh.

Tên khóa có thể đọc được lập chỉ mục bởi mã khóa

Có tương đối ít mã khóa, vì vậy tôi chỉ liệt kê tất cả các giá trị tương ứng trong một mảng tĩnh để tôi có thể chuyển đổi số 65thành Asử dụngkeyboardMap[65]

Không phải tất cả các mã khóa ánh xạ tới một ký tự có thể in được để một số chuỗi nhận dạng khác được trả về.

Bạn có thể cần sửa đổi mảng cho phù hợp với nhu cầu của mình và chỉ có thể trả về các chuỗi trống cho tất cả các ký tự bạn không quan tâm để dịch. Mảng sau đây cho phép tôi xác định nhanh chóng và đáng tin cậy phím nào được nhấn trong bất kỳ môi trường nào. Thưởng thức!

// names of known key codes (0-255)

var keyboardMap = [
  "", // [0]
  "", // [1]
  "", // [2]
  "CANCEL", // [3]
  "", // [4]
  "", // [5]
  "HELP", // [6]
  "", // [7]
  "BACK_SPACE", // [8]
  "TAB", // [9]
  "", // [10]
  "", // [11]
  "CLEAR", // [12]
  "ENTER", // [13]
  "ENTER_SPECIAL", // [14]
  "", // [15]
  "SHIFT", // [16]
  "CONTROL", // [17]
  "ALT", // [18]
  "PAUSE", // [19]
  "CAPS_LOCK", // [20]
  "KANA", // [21]
  "EISU", // [22]
  "JUNJA", // [23]
  "FINAL", // [24]
  "HANJA", // [25]
  "", // [26]
  "ESCAPE", // [27]
  "CONVERT", // [28]
  "NONCONVERT", // [29]
  "ACCEPT", // [30]
  "MODECHANGE", // [31]
  "SPACE", // [32]
  "PAGE_UP", // [33]
  "PAGE_DOWN", // [34]
  "END", // [35]
  "HOME", // [36]
  "LEFT", // [37]
  "UP", // [38]
  "RIGHT", // [39]
  "DOWN", // [40]
  "SELECT", // [41]
  "PRINT", // [42]
  "EXECUTE", // [43]
  "PRINTSCREEN", // [44]
  "INSERT", // [45]
  "DELETE", // [46]
  "", // [47]
  "0", // [48]
  "1", // [49]
  "2", // [50]
  "3", // [51]
  "4", // [52]
  "5", // [53]
  "6", // [54]
  "7", // [55]
  "8", // [56]
  "9", // [57]
  "COLON", // [58]
  "SEMICOLON", // [59]
  "LESS_THAN", // [60]
  "EQUALS", // [61]
  "GREATER_THAN", // [62]
  "QUESTION_MARK", // [63]
  "AT", // [64]
  "A", // [65]
  "B", // [66]
  "C", // [67]
  "D", // [68]
  "E", // [69]
  "F", // [70]
  "G", // [71]
  "H", // [72]
  "I", // [73]
  "J", // [74]
  "K", // [75]
  "L", // [76]
  "M", // [77]
  "N", // [78]
  "O", // [79]
  "P", // [80]
  "Q", // [81]
  "R", // [82]
  "S", // [83]
  "T", // [84]
  "U", // [85]
  "V", // [86]
  "W", // [87]
  "X", // [88]
  "Y", // [89]
  "Z", // [90]
  "OS_KEY", // [91] Windows Key (Windows) or Command Key (Mac)
  "", // [92]
  "CONTEXT_MENU", // [93]
  "", // [94]
  "SLEEP", // [95]
  "NUMPAD0", // [96]
  "NUMPAD1", // [97]
  "NUMPAD2", // [98]
  "NUMPAD3", // [99]
  "NUMPAD4", // [100]
  "NUMPAD5", // [101]
  "NUMPAD6", // [102]
  "NUMPAD7", // [103]
  "NUMPAD8", // [104]
  "NUMPAD9", // [105]
  "MULTIPLY", // [106]
  "ADD", // [107]
  "SEPARATOR", // [108]
  "SUBTRACT", // [109]
  "DECIMAL", // [110]
  "DIVIDE", // [111]
  "F1", // [112]
  "F2", // [113]
  "F3", // [114]
  "F4", // [115]
  "F5", // [116]
  "F6", // [117]
  "F7", // [118]
  "F8", // [119]
  "F9", // [120]
  "F10", // [121]
  "F11", // [122]
  "F12", // [123]
  "F13", // [124]
  "F14", // [125]
  "F15", // [126]
  "F16", // [127]
  "F17", // [128]
  "F18", // [129]
  "F19", // [130]
  "F20", // [131]
  "F21", // [132]
  "F22", // [133]
  "F23", // [134]
  "F24", // [135]
  "", // [136]
  "", // [137]
  "", // [138]
  "", // [139]
  "", // [140]
  "", // [141]
  "", // [142]
  "", // [143]
  "NUM_LOCK", // [144]
  "SCROLL_LOCK", // [145]
  "WIN_OEM_FJ_JISHO", // [146]
  "WIN_OEM_FJ_MASSHOU", // [147]
  "WIN_OEM_FJ_TOUROKU", // [148]
  "WIN_OEM_FJ_LOYA", // [149]
  "WIN_OEM_FJ_ROYA", // [150]
  "", // [151]
  "", // [152]
  "", // [153]
  "", // [154]
  "", // [155]
  "", // [156]
  "", // [157]
  "", // [158]
  "", // [159]
  "CIRCUMFLEX", // [160]
  "EXCLAMATION", // [161]
  "DOUBLE_QUOTE", // [162]
  "HASH", // [163]
  "DOLLAR", // [164]
  "PERCENT", // [165]
  "AMPERSAND", // [166]
  "UNDERSCORE", // [167]
  "OPEN_PAREN", // [168]
  "CLOSE_PAREN", // [169]
  "ASTERISK", // [170]
  "PLUS", // [171]
  "PIPE", // [172]
  "HYPHEN_MINUS", // [173]
  "OPEN_CURLY_BRACKET", // [174]
  "CLOSE_CURLY_BRACKET", // [175]
  "TILDE", // [176]
  "", // [177]
  "", // [178]
  "", // [179]
  "", // [180]
  "VOLUME_MUTE", // [181]
  "VOLUME_DOWN", // [182]
  "VOLUME_UP", // [183]
  "", // [184]
  "", // [185]
  "SEMICOLON", // [186]
  "EQUALS", // [187]
  "COMMA", // [188]
  "MINUS", // [189]
  "PERIOD", // [190]
  "SLASH", // [191]
  "BACK_QUOTE", // [192]
  "", // [193]
  "", // [194]
  "", // [195]
  "", // [196]
  "", // [197]
  "", // [198]
  "", // [199]
  "", // [200]
  "", // [201]
  "", // [202]
  "", // [203]
  "", // [204]
  "", // [205]
  "", // [206]
  "", // [207]
  "", // [208]
  "", // [209]
  "", // [210]
  "", // [211]
  "", // [212]
  "", // [213]
  "", // [214]
  "", // [215]
  "", // [216]
  "", // [217]
  "", // [218]
  "OPEN_BRACKET", // [219]
  "BACK_SLASH", // [220]
  "CLOSE_BRACKET", // [221]
  "QUOTE", // [222]
  "", // [223]
  "META", // [224]
  "ALTGR", // [225]
  "", // [226]
  "WIN_ICO_HELP", // [227]
  "WIN_ICO_00", // [228]
  "", // [229]
  "WIN_ICO_CLEAR", // [230]
  "", // [231]
  "", // [232]
  "WIN_OEM_RESET", // [233]
  "WIN_OEM_JUMP", // [234]
  "WIN_OEM_PA1", // [235]
  "WIN_OEM_PA2", // [236]
  "WIN_OEM_PA3", // [237]
  "WIN_OEM_WSCTRL", // [238]
  "WIN_OEM_CUSEL", // [239]
  "WIN_OEM_ATTN", // [240]
  "WIN_OEM_FINISH", // [241]
  "WIN_OEM_COPY", // [242]
  "WIN_OEM_AUTO", // [243]
  "WIN_OEM_ENLW", // [244]
  "WIN_OEM_BACKTAB", // [245]
  "ATTN", // [246]
  "CRSEL", // [247]
  "EXSEL", // [248]
  "EREOF", // [249]
  "PLAY", // [250]
  "ZOOM", // [251]
  "", // [252]
  "PA1", // [253]
  "WIN_OEM_CLEAR", // [254]
  "" // [255]
];

Lưu ý: Vị trí của từng giá trị trong mảng trên là quan trọng. Các ""giữ chỗ cho mã với các giá trị không xác định.

Hãy thử đoạn mã sau bằng cách sử dụng phương pháp tra cứu mảng tĩnh này ...

var keyCodes = [];

$("#reset").click(function() {
  keyCodes = [];
  $("#in").val("");
  $("#key-codes").html("var keyCodes = [ ];");
  $("#key-names").html("var keyNames = [ ];");
});

$(document).keydown(function(e) {
  keyCodes.push(e.which);
  updateOutput();
});

function updateOutput() {
  var kC = "var keyCodes = [ ";
  var kN = "var keyNames = [ ";

  var len = keyCodes.length;

  for (var i = 0; i < len; i++) {
    kC += keyCodes[i];
    kN += "'"+keyboardMap[keyCodes[i]]+"'";
    if (i !== (len - 1)) {
      kC += ", ";
      kN += ", ";
    }
  }

  kC += " ];";
  kN += " ];";

  $("#key-codes").html(kC);
  $("#key-names").html(kN);
}



var keyboardMap = [
  "", // [0]
  "", // [1]
  "", // [2]
  "CANCEL", // [3]
  "", // [4]
  "", // [5]
  "HELP", // [6]
  "", // [7]
  "BACK_SPACE", // [8]
  "TAB", // [9]
  "", // [10]
  "", // [11]
  "CLEAR", // [12]
  "ENTER", // [13]
  "ENTER_SPECIAL", // [14]
  "", // [15]
  "SHIFT", // [16]
  "CONTROL", // [17]
  "ALT", // [18]
  "PAUSE", // [19]
  "CAPS_LOCK", // [20]
  "KANA", // [21]
  "EISU", // [22]
  "JUNJA", // [23]
  "FINAL", // [24]
  "HANJA", // [25]
  "", // [26]
  "ESCAPE", // [27]
  "CONVERT", // [28]
  "NONCONVERT", // [29]
  "ACCEPT", // [30]
  "MODECHANGE", // [31]
  "SPACE", // [32]
  "PAGE_UP", // [33]
  "PAGE_DOWN", // [34]
  "END", // [35]
  "HOME", // [36]
  "LEFT", // [37]
  "UP", // [38]
  "RIGHT", // [39]
  "DOWN", // [40]
  "SELECT", // [41]
  "PRINT", // [42]
  "EXECUTE", // [43]
  "PRINTSCREEN", // [44]
  "INSERT", // [45]
  "DELETE", // [46]
  "", // [47]
  "0", // [48]
  "1", // [49]
  "2", // [50]
  "3", // [51]
  "4", // [52]
  "5", // [53]
  "6", // [54]
  "7", // [55]
  "8", // [56]
  "9", // [57]
  "COLON", // [58]
  "SEMICOLON", // [59]
  "LESS_THAN", // [60]
  "EQUALS", // [61]
  "GREATER_THAN", // [62]
  "QUESTION_MARK", // [63]
  "AT", // [64]
  "A", // [65]
  "B", // [66]
  "C", // [67]
  "D", // [68]
  "E", // [69]
  "F", // [70]
  "G", // [71]
  "H", // [72]
  "I", // [73]
  "J", // [74]
  "K", // [75]
  "L", // [76]
  "M", // [77]
  "N", // [78]
  "O", // [79]
  "P", // [80]
  "Q", // [81]
  "R", // [82]
  "S", // [83]
  "T", // [84]
  "U", // [85]
  "V", // [86]
  "W", // [87]
  "X", // [88]
  "Y", // [89]
  "Z", // [90]
  "OS_KEY", // [91] Windows Key (Windows) or Command Key (Mac)
  "", // [92]
  "CONTEXT_MENU", // [93]
  "", // [94]
  "SLEEP", // [95]
  "NUMPAD0", // [96]
  "NUMPAD1", // [97]
  "NUMPAD2", // [98]
  "NUMPAD3", // [99]
  "NUMPAD4", // [100]
  "NUMPAD5", // [101]
  "NUMPAD6", // [102]
  "NUMPAD7", // [103]
  "NUMPAD8", // [104]
  "NUMPAD9", // [105]
  "MULTIPLY", // [106]
  "ADD", // [107]
  "SEPARATOR", // [108]
  "SUBTRACT", // [109]
  "DECIMAL", // [110]
  "DIVIDE", // [111]
  "F1", // [112]
  "F2", // [113]
  "F3", // [114]
  "F4", // [115]
  "F5", // [116]
  "F6", // [117]
  "F7", // [118]
  "F8", // [119]
  "F9", // [120]
  "F10", // [121]
  "F11", // [122]
  "F12", // [123]
  "F13", // [124]
  "F14", // [125]
  "F15", // [126]
  "F16", // [127]
  "F17", // [128]
  "F18", // [129]
  "F19", // [130]
  "F20", // [131]
  "F21", // [132]
  "F22", // [133]
  "F23", // [134]
  "F24", // [135]
  "", // [136]
  "", // [137]
  "", // [138]
  "", // [139]
  "", // [140]
  "", // [141]
  "", // [142]
  "", // [143]
  "NUM_LOCK", // [144]
  "SCROLL_LOCK", // [145]
  "WIN_OEM_FJ_JISHO", // [146]
  "WIN_OEM_FJ_MASSHOU", // [147]
  "WIN_OEM_FJ_TOUROKU", // [148]
  "WIN_OEM_FJ_LOYA", // [149]
  "WIN_OEM_FJ_ROYA", // [150]
  "", // [151]
  "", // [152]
  "", // [153]
  "", // [154]
  "", // [155]
  "", // [156]
  "", // [157]
  "", // [158]
  "", // [159]
  "CIRCUMFLEX", // [160]
  "EXCLAMATION", // [161]
  "DOUBLE_QUOTE", // [162]
  "HASH", // [163]
  "DOLLAR", // [164]
  "PERCENT", // [165]
  "AMPERSAND", // [166]
  "UNDERSCORE", // [167]
  "OPEN_PAREN", // [168]
  "CLOSE_PAREN", // [169]
  "ASTERISK", // [170]
  "PLUS", // [171]
  "PIPE", // [172]
  "HYPHEN_MINUS", // [173]
  "OPEN_CURLY_BRACKET", // [174]
  "CLOSE_CURLY_BRACKET", // [175]
  "TILDE", // [176]
  "", // [177]
  "", // [178]
  "", // [179]
  "", // [180]
  "VOLUME_MUTE", // [181]
  "VOLUME_DOWN", // [182]
  "VOLUME_UP", // [183]
  "", // [184]
  "", // [185]
  "SEMICOLON", // [186]
  "EQUALS", // [187]
  "COMMA", // [188]
  "MINUS", // [189]
  "PERIOD", // [190]
  "SLASH", // [191]
  "BACK_QUOTE", // [192]
  "", // [193]
  "", // [194]
  "", // [195]
  "", // [196]
  "", // [197]
  "", // [198]
  "", // [199]
  "", // [200]
  "", // [201]
  "", // [202]
  "", // [203]
  "", // [204]
  "", // [205]
  "", // [206]
  "", // [207]
  "", // [208]
  "", // [209]
  "", // [210]
  "", // [211]
  "", // [212]
  "", // [213]
  "", // [214]
  "", // [215]
  "", // [216]
  "", // [217]
  "", // [218]
  "OPEN_BRACKET", // [219]
  "BACK_SLASH", // [220]
  "CLOSE_BRACKET", // [221]
  "QUOTE", // [222]
  "", // [223]
  "META", // [224]
  "ALTGR", // [225]
  "", // [226]
  "WIN_ICO_HELP", // [227]
  "WIN_ICO_00", // [228]
  "", // [229]
  "WIN_ICO_CLEAR", // [230]
  "", // [231]
  "", // [232]
  "WIN_OEM_RESET", // [233]
  "WIN_OEM_JUMP", // [234]
  "WIN_OEM_PA1", // [235]
  "WIN_OEM_PA2", // [236]
  "WIN_OEM_PA3", // [237]
  "WIN_OEM_WSCTRL", // [238]
  "WIN_OEM_CUSEL", // [239]
  "WIN_OEM_ATTN", // [240]
  "WIN_OEM_FINISH", // [241]
  "WIN_OEM_COPY", // [242]
  "WIN_OEM_AUTO", // [243]
  "WIN_OEM_ENLW", // [244]
  "WIN_OEM_BACKTAB", // [245]
  "ATTN", // [246]
  "CRSEL", // [247]
  "EXSEL", // [248]
  "EREOF", // [249]
  "PLAY", // [250]
  "ZOOM", // [251]
  "", // [252]
  "PA1", // [253]
  "WIN_OEM_CLEAR", // [254]
  "" // [255]
];

#key-codes,
#key-names {
  font-family: courier, serif;
  font-size: 1.2em;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="in" placeholder="Type here..." />
<button id="reset">Reset</button>
<br/>
<br/>
<div id="key-codes">var keyCodes = [ ];</div>
<div id="key-names">var keyNames = [ ];</div>

Mã khóa đáng chú ý

Chữ AZ: (65-90)

keyboardMap[65];  // A
...
keyboardMap[90];  // Z

Chữ số 0-9: (48-57)

keyboardMap[48];  // 0
...
keyboardMap[57];  // 9

Số Pad 0-9: (96-105)

keyboardMap[96];   // NUMPAD0
...
keyboardMap[105];  // NUMPAD9

Phím mũi tên: (37-40)

keyboardMap[37];  // LEFT
keyboardMap[38];  // UP
keyboardMap[39];  // RIGHT
keyboardMap[40];  // DOWN

Phím Tab: (9)

keyboardMap[9];  // TAB

Nhập khóa: (13)

keyboardMap[13];  // ENTER

Phím cách: (32)

keyboardMap[32];  // SPACE

Khóa cụ thể của hệ điều hành (91) Khóa Windows (Windows) hoặc Khóa lệnh (Mac)

keyboardMap[91];  // OS_KEY

Phím Alt: (18)

keyboardMap[18];  // ALT

Khóa điều khiển: (17)

keyboardMap[17];  // CONTROL

Phím Shift: (16)

keyboardMap[16];  // SHIFT

Phím khóa mũ: (20)

keyboardMap[20];  // CAPS_LOCK

Chỉ cần một lưu ý quan trọng: câu trả lời được chấp nhận ở trên sẽ không hoạt động chính xác cho keyCode> = 144, tức là dấu chấm, dấu phẩy, dấu gạch ngang, v.v. Đối với những người bạn nên sử dụng thuật toán tổng quát hơn:

let chrCode = keyCode - 48 * Math.floor(keyCode / 48);
let chr = String.fromCharCode((96 <= keyCode) ? chrCode: keyCode);

Nếu bạn tò mò về lý do tại sao, điều này rõ ràng là cần thiết vì hành vi của hàm JS tích hợp String.fromCharCode(). Đối với các giá trị của keyCode <= 96nó dường như ánh xạ bằng cách sử dụng hàm:

chrCode = keyCode - 48 * Math.floor(keyCode / 48)

Đối với các giá trị của keyCode > 96nó dường như ánh xạ bằng cách sử dụng hàm:

chrCode = keyCode

Nếu điều này có vẻ như hành vi kỳ quặc thì tốt..Tôi đồng ý. Đáng buồn thay, nó sẽ rất xa với điều kỳ lạ nhất tôi từng thấy trong lõi JS.

document.onkeydown = function(e) {
    let keyCode = e.keyCode;
    let chrCode = keyCode - 48 * Math.floor(keyCode / 48);
    let chr = String.fromCharCode((96 <= keyCode) ? chrCode: keyCode);
    console.log(chr);
};

<input type="text" placeholder="Focus and Type"/>

Tôi giả định rằng đây là cho một trò chơi hoặc cho một loại ứng dụng phản ứng nhanh do đó sử dụng KEYDOWN hơn KEYPRESS.

Chỉnh sửa : Đăng! Tôi đã sửa chữa (cảm ơn bạn Crescent Fresh và David): JQuery (hoặc thậm chí là các máy chủ DOM cơ bản) không tiết lộ chi tiết về WM_KEYDOWN và các sự kiện khác. Thay vào đó họ tiêu hóa trước dữ liệu này và, trong trường hợp keyDown ngay cả trong JQuery, chúng tôi nhận được:

• event.keyCode cho các khóa không có ký tự
• event.charCode cho các phím ký tự

Lưu ý rằng các thuộc tính này là các giá trị UniCode.
Lưu ý, tôi không thể tìm thấy một tài liệu tham khảo có thẩm quyền trong tài liệu JQuery, nhưng nhiều ví dụ có uy tín trên mạng đề cập đến hai thuộc tính này.

Do đó, đoạn mã sau, được điều chỉnh từ một số java (không phải javascript) của tôi, do đó hoàn toàn sai ...

Phần sau đây sẽ cung cấp cho bạn các phần "thú vị" của mã khóa:

  value = e.KeyCode;
  repeatCount = value & 0xFF;
  scanCode = (value >> 16) & 0xFF;  // note we take the "extended bit" deal w/ it later.
  wasDown = ((value & 0x4000) != 0);  // indicate key was readily down (auto-repeat)
  if (scanCode > 127)
      // deal with extended
  else
      // "regular" character

Tôi biết đây là một câu hỏi cũ, nhưng hôm nay tôi đã tìm thấy một giải pháp đóng gói sẵn cho vấn đề này và không tìm thấy gì thực sự đáp ứng nhu cầu của tôi.

Đây là một giải pháp (chỉ bằng tiếng Anh) hỗ trợ chính xác Chữ hoa (thay đổi), Chữ thường, dấu câu, bàn phím số, v.v.

Nó cũng cho phép nhận dạng đơn giản và chuyển tiếp - và phản ứng với - các phím không in được, như ESC, Mũi tên, Phím chức năng, v.v.

https://jsfiddle.net/5hhu896g/1/

keyboardCharMap and keyboardNameMap are the key to making this work

Cảm ơn DaveAlger đã giúp tôi tiết kiệm một số thao tác gõ - và nhiều khám phá! - bằng cách cung cấp Mảng khóa được đặt tên.

Gần đây tôi đã viết một module gọi là keysight rằng dịch keypress, keydownvà keyupcác sự kiện vào nhân vật và các phím tương ứng.

Thí dụ:

 element.addEventListener("keydown", function(event) {
    var character = keysight(event).char
 })

Đối với những người bạn đến đây để tìm kiếm các giá trị ký tự Unicode thực tế cho một mã khóa, như tôi đã làm, đây là một chức năng cho điều đó. Ví dụ, được cung cấp mã mũi tên unicode bên phải, mã này sẽ xuất ra chuỗi hiển thị\u001B\u005B\u0043

function toUnicode(theString) {
    var unicodeString = '';
    for (var i = 0; i < theString.length; i++) {
        var theUnicode = theString.charCodeAt(i).toString(16).toUpperCase();
        while (theUnicode.length < 4) {
            theUnicode = '0' + theUnicode;
        }
        theUnicode = '\\u' + theUnicode;
        unicodeString += theUnicode;
    }
    return unicodeString;
}

Bạn cũng có thể sử dụng thuộc tính chỉ đọc key. Nó cũng tôn trọng các khóa đặc biệt như shiftvv và được IE9 hỗ trợ.

Khi một ký tự không thể in hoặc đặc biệt được nhấn, giá trị sẽ nằm trên các giá trị khóa được xác định như 'Shift'hoặc 'Multiply'.

• Bàn phím     event.key
• X             -> 'x'
• Shift+ X ->'X'
• F5            -> 'F5'

Tham khảo liên kết này Nhận Mã khóa từ bấm phím và giá trị char cho bất kỳ mã khóa nào

$('input#inp').keyup(function(e){
   $(this).val(String.fromCharCode(e.keyCode)); 
   $('div#output').html('Keycode : ' + e.keyCode);  
});