Làm thế nào để bắt event.keyCode và thay đổi nó thành một mã khóa khác?

Question

Tôi đã kiểm tra các câu hỏi khác tại đây tại SO, tuy nhiên họ không trả lời câu hỏi của tôi. Tôi muốn chỉ đơn giản là nắm bắt một số mã khóa và thay thế nó bằng một mã khóa khác. Tôi đang làm việc với các nhân vật, không phải không gian màu trắng, và tôi không cần phải mất tập trung hoặc tương tự.

Dưới đây là mã của tôi. Nhưng bạn có thể thay thế các mã phím đó bằng (ví dụ: khi viết hoa "A" được nhấn, nó sẽ thay thế bằng 0, v.v.). Ý tưởng là thay thế mã khóa.

phrase.keypress(function(event) 
{ 
    if (event.shiftKey) 
    { 
     switch (event.keyCode) 
     { 
      // Cyrillic capitalized "Н" was pressed 
      case 1053: event.keyCode = 1187; event.charCode = 1187; event.which = 1187; break; 
      // Cyrillic capitalized "О" was pressed 
      case 1054: event.keyCode = 1257; event.charCode = 1257; event.which = 1257; break; 
      // Cyrillic capitalized "У" was pressed 
      case 1059: event.keyCode = 1199; event.charCode = 1199; event.which = 1199; break; 
     } 
    } 
}); 

Tôi cũng đã thử với khóa phím và khóa. Chúng không thay đổi mã khóa. Làm thế nào tôi có thể làm điều đó?

P.S. Nếu có thể, tôi đang tìm một giải pháp không "event.preventDefault() và chèn thủ công khóa mong muốn vào trường nhập, sau đó di chuyển con trỏ đến cuối". Tôi muốn giải pháp sạch hơn và "đúng". Cảm ơn bạn.

Answer 1

Thuộc tính sự kiện bàn phím là tất cả chỉ đọc. Bạn không thể chụp một mã khóa và thay đổi mã này thành mã khóa khác.

Xem tham chiếu từ MDN - Keyboard Events - Tất cả chỉ đọc được không thể đặt.

Như bạn đã đề cập trong bài đăng của mình. - Nếu bạn không xử lý, thì bạn phải ngừng nhấn phím mặc định của trình duyệt và đặt giá trị mong muốn cho chính phần tử đó.

Answer 2

Tôi đang sử dụng mã sau để đạt được kết quả tương tự như khi tôi đã thay đổi keyCode, mà thực sự không thể thay đổi nó.

function inputValidation() { 
    var srcField = event.srcElement; 
    var sKey = event.keyCode; 
    var inputLetter = String.fromCharCode(sKey); 
    if (typeof(srcField) !== "undefined" && srcField !== null) { 
     inputLetter = transformInput(inputLetter); 
     var caretPos = srcField.selectionStart; 
     var startString = srcField.value.slice(0, srcField.selectionStart); 
     var endString = srcField.value.slice(srcField.selectionEnd, srcField.value.length); 
     srcField.value = startString + inputLetter + endString; 
     setCaretPosition(srcField, caretPos+1); // '+1' puts the caret after the input 
     event.preventDefault ? event.preventDefault() : event.returnValue = false; //for IE8 
    } 
} 

srcField.selectionStart cung cấp cho các vị trí bắt đầu của văn bản bạn đã chọn và srcField.selectionEnd cung cấp cho các điểm kết thúc của việc lựa chọn, nếu bạn chưa chọn bất kỳ văn bản srcField.selectionStart bằng srcField.selectionEnd.

Chức năng setCaretPosition đến từ this answer bởi kd7. Tôi chỉ thay đổi nó để làm cho nó nhận được phần tử thay vì Id của nó thay vì Id của nó

function setCaretPosition(elem, caretPos) { 
    if (elem != null) { 
     if (elem.createTextRange) { 
      var range = elem.createTextRange(); 
      range.move('character', caretPos); 
      range.select(); 
     } else { 
      if (elem.selectionStart) { 
       elem.focus(); 
       elem.setSelectionRange(caretPos, caretPos); 
      } else 
       elem.focus(); 
     } 
    } 
}