如何捕获事件的keyCode并将其更改为另一个keyCode？

Question

我在SO上查看了其他的问题，但它们并没有回答我的问题。 我想简单地捕捉某些keyCode并将其替换为另一个keyCode。 我正在处理字符，而不是空格，也不需要丢失焦点或类似的东西。

以下是我的代码。 但您可以将那些keyCodes替换为您自己的（例如按下大写字母“A”时，应替换为数字0等）。 思路是替换keyCode。

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;
        }
    }
});

我尝试使用keydown和keyup，但它们不会改变keyCode。我该怎么办？

顺便说一句，如果可能的话，我希望找到一种不需要 "event.preventDefault()并手动插入所需的按键到输入字段，然后将光标移到结尾" 的解决方案。我想要更干净、"正确" 的解决方案。谢谢。

- esengineer

Answer 1

键盘事件属性都是只读的，你不能捕获一个keyCode并将其更改为另一个。

参见MDN - 键盘事件 - 所有属性都是只读的，不能设置。

正如您在帖子中提到的。 -- 如果您想处理，则必须停止浏览器默认按键并自己将所需值设置给元素。

- Selvakumar Arumugam

---

谢谢。现在我知道它们是只读的。我已经实现了那个“手动”的解决方案。 - esengineer

只是一些可能有用的东西。我在jQuery论坛上发布了一个“哪个”代码列表。对你有帮助的话，那就太好了。如果不是，那么对于其他人来说可能会有所帮助。http://forum.jquery.com/topic/eventwhich-code-list-just-for-help - SpYk3HH

Answer 2

虽然 KeyboardEvent 实例上的属性是只读的，但你可以重写 KeyboardEvent 的原型并为想要更改的内容创建 getter。以下是一个示例，它将 hjkl 的键码更改为类似箭头键的行为。

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
        }
    }
})

- Sean256

---

那是一个很好的解决方案。 - theMaxx

Answer 3

我正在使用以下代码来实现与更改keyCode相同的结果，而实际上无法更改它。

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表示您选择的文本的起始位置，srcField.selectionEnd表示选择的结束位置。如果您没有选择任何文本，则srcField.selectionStart等于srcField.selectionEnd。

setCaretPosition函数来自kd7的这个答案，我只是修改了它，使其接收元素而不是其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();
        }
    }
}

- MauricioJuanes

Answer 4

您可以手动更改值并处理键盘按键。如果您想检查按键，请声明变量并检查您的按键代码。

this.event.target.value = this.event.target.value + ".";
return false;

完整代码：

function isNumberKeyDec(evt) {
    var charCode = (evt.which) ? evt.which : event.keyCode;
    var apos = 0;
    if (charCode == 44) {
        apos = 1;
        charCode = 46;
    }
    if (this.event.target.value.length == 0 && charCode == 46) {
        return false;
    }
    if (this.event.target.value.length == 1 && this.event.target.value == "0" && charCode == 48) {
        return false;
    }
    if (this.event.target.value.length == 1 && this.event.target.value == "0" && charCode != 46) {
        this.event.target.value = "";
    }    
    if (charCode > 31 && (charCode < 48 || charCode > 57) && charCode != 46) {

        return false;
    }
    if (charCode == 46 && this.event.target.value.indexOf(".") != -1) {
        return false;
    }
    if (this.event.target.value.indexOf(".") != -1) {
        if (this.event.target.value.substring(this.event.target.value.toString().indexOf(".")).length >= 2) {
            return false;
        }        
    }
    if (this.event.target.value.indexOf(".") == -1 && charCode != 46) {
        if (this.event.target.value.length >= 3 && charCode != 46) {
            return false;
        }
    }
    if (apos == 1) {
        this.event.target.value = this.event.target.value + ".";
        return false;
    }
    return true;
}

- burak

---

谢谢，这对我有用。我使用了：this.event.target.value = this.event.target.value + ","; this.event.preventDefault(false); - Weslley Rufino de Lima