La guía paso a paso o código que hallarás en este post es la solución más rápida y efectiva que encontramos a esta duda o dilema.
Solución:
Las propiedades de los eventos del teclado son todas de solo LECTURA. No puede capturar un código clave y cambiarlo por otro.
Consulte la referencia de MDN – Eventos de teclado: todos son de solo lectura, no se pueden configurar.
Como mencionas en tu publicación. — Si no desea manejar, debe detener el navegador predeterminado key presione y configure usted mismo el valor deseado para el elemento.
Estoy usando el siguiente código para lograr el mismo resultado que si hubiera cambiado el keyCode
sin poder cambiarlo realmente.
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
da la posición inicial del texto que ha seleccionado y srcField.selectionEnd
da la posición final de la selección, si no ha seleccionado ningún texto srcField.selectionStart
es igual srcField.selectionEnd
.
La función setCaretPosition
vino de esta respuesta por kd7. Solo lo cambié para que reciba el elemento en lugar de su Id.
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();
Si bien las propiedades en la instancia de KeyboardEvent son de SOLO LECTURA, puede anular KeyboardEvent
y crea un getter para lo que quieras cambiar. Aquí hay un ejemplo que cambia los códigos clave de hjkl para que actúen como una flecha keys.
Object.defineProperty(KeyboardEvent.prototype, 'keyCode',
get: function()
switch (this.key)
case 'h': return 37; // left
case 'j': return 40; // down
case 'k': return 38; // up
case 'l': return 39; // right
default: return this.which
)