IE e.keyCode - Làm cách nào để phân biệt giữa ký hiệu và mũi tên lên?

Question

Tôi đang chiến đấu với một hành vi javascript rất lạ trên tiện ích con giao diện người dùng jQuery mà tôi đang cố gắng khắc phục. IE7 (win XP), jQuery 1.2.6 (có, đó là phiên bản cũ).

Tiện ích con là hộp tổ hợp, nắm bắt các sự kiện bàn phím và có các hành vi đặc biệt cho các phím mũi tên.

Khi tôi cố gắng nhập ký tự "&" vào trường nhập flexbox, tôi nhận được hành vi lạ.

Các flexbox có một số mã như:

//initialization 
$myInputElement.keypress($.flexbox.process_key); 
$.flexbox.process_key = function process_key(e) { 
    $.flexbox.flexboxFromInput(this).processKey(e); 
    return true; 
}; 

//on the flexbox object's prototype: 
... 
    processKey: function processKey(e) { 
     var mod = 0; 
      if (typeof (e.ctrlKey) !== 'undefined') { 
       if (e.ctrlKey) mod |= 1; 
       if (e.shiftKey) mod |= 2; 
      } else { 
       if (e.modifiers & Event.CONTROL_MASK) mod |= 1; 
       if (e.modifiers & Event.SHIFT_MASK) mod |= 2; 
      } 
      ... 
      switch (e.keyCode) { 
        case 38: // up 
         this.prevResult(); 
         break; 
        case 40: // down 
         if (this.getCtr().is(':visible')) this.nextResult(); 
         else this.flexboxDelay(true); 
         break; 
       ...etc. 
      } 
    } 
... 

Khi tôi giới thiệu một tuyên bố khai thác gỗ, những gì tôi thấy là nhấn "&" (shift + 7) tạo ra ba sự kiện nhấn phím:

INFO: Flexbox> processKey, keyCode=16, ctrl=false, shift=true 
INFO: Flexbox> processKey, keyCode=55, ctrl=false, shift=true 
INFO: Flexbox> processKey, keyCode=38, ctrl=false, shift=true 

Rõ ràng, mã phím 38 là cả phím mũi tên lên và mã ASCII cho dấu và ??

Khi tôi đang viết điều này, tôi đã phát hiện phím bấm là "shift + 7" (mã phím 55) để coi phím đó là phím dấu và, sau đó đặt một số loại cờ để bỏ qua lần nhấn phím tiếp theo (đó là 38). Điều này có vẻ như một hack khủng khiếp.

Có ai có cách nào tốt hơn để phân biệt giữa các ký tự đặc biệt như "&" và các phím mũi tên trong IE không?

Answer 1

Đây là những gì tôi đã kết thúc thực hiện:

/* 
    * Hack around a wierd behavior in IE where "&%'(" have the same keyCodes 
    * as the arrow keys. 
    */ 
     if (keyCodeIn(e.keyCode, 55, 53, 57) && (mod & 2) && !(mod & 1)) { 
      this.ignoreNextArrowKey = true; 
     } 
     else if (222 === e.keyCode && !(mod & 2) && !(mod & 1)) { 
      this.ignoreNextArrowKey = true; 
     } 
     else if (keyCodeIn(e.keyCode, 38, 37, 39, 40) && this.ignoreNextArrowKey) { 
      this.ignoreNextArrowKey = false; 
      return; 
     } 

     //... 

     function keyCodeIn(keyCode) { 
      for(var i = 1; i < arguments.length; i++) { 
       if (arguments[i] === keyCode) { 
        return true; 
       } 
      } 
      return false; 
     } 

Hy vọng điều này sẽ giúp ai đó. Nếu bạn đang sử dụng lại mã này, bạn có thể phải điều chỉnh việc sử dụng từ khóa 'this', tùy thuộc vào đối tượng mà nó đề cập đến (ở đây, nó là đối tượng javascript được liên kết với tiện ích flexbox).

Chỉnh sửa: Tôi đã cập nhật mã này và xóa kiểm tra biểu thức chính quy đã có trước đây mà tôi phát hiện thấy lỗi.

Answer 2

Tôi nghĩ keydown có thể cung cấp cho bạn dữ liệu đáng tin cậy hơn keypress.

Answer 3

nốt lên xuống trả về một keyCode 55 cho '&' và 38 cho 'Mũi tên Up'

Answer 4

tôi khuyên bạn nên sử dụng thư viện jquery này để viết xử lý tùy chỉnh cho keypresses: http://code.google.com/p/js-hotkeys/

Đang cố gắng để phân biệt keycodes hợp lý là một cơn ác mộng.