javascript - 更改按键

Question

在输入框或 contenteditable=true div 中，如何修改字母“a”的按键以返回字母“b”的按键？即，每次在 div 中输入字母“a”时，输出实际上是字母“b”。

我并不关心在 IE 中运行的解决方案 - 只是在 Safari、Chrome 和 FF 中运行的解决方案。

在 Chrome 中，我可以看到按键事件具有属性“charCode”、“keyCode”和“which”，所有这些属性都被分配了按键事件编号。如果我在按键上触发事件，我可以修改这些值，但我无法弄清楚要返回什么，因此输入的实际键是不同的。例如:

$(window).keypress(function(e){  //$(window) is a jQuery object
    e.charCode = 102;
    e.which = 102;
    e.keyCode = 102;
    console.log(e);
    return e;
});

我还可以看到，除了 charCode、which 和 keyCode 之外，还有一个“originalEvent”属性，该属性也具有这些属性。但是，我无法修改这些(我尝试过使用 e.originalEvent.charCode = 102 之类的东西)。

Answer 1

您无法更改与按键事件关联的字符或按键，也无法完全模拟按键事件。但是，您可以自己处理按键并在当前插入点/插入符处手动插入所需的字符。我在 Stack Overflow 上的许多地方提供了执行此操作的代码。对于 contenteditable 元素:

• Need to set cursor position to the end of a contentEditable div, issue with selection and range objects

这是一个 jsFiddle 示例:http://www.jsfiddle.net/Ukkmu/4/

对于输入:

• Can I conditionally change the character entered into an input on keypress?

• show different keyboard character from the typed one in google chrome

跨浏览器jsFiddle示例:http://www.jsfiddle.net/EXH2k/6/

IE >= 9 和非 IE jsFiddle 示例:http://www.jsfiddle.net/EXH2k/7/