JSFiddle - React, Tailwind, and code Playground
HTML
<textarea id="foo" cols="80" rows="8">Type in here and any 'a' will be you type will show up as a 'b'</textarea>
JavaScript
function transformTypedChar(charStr) {
return charStr == "a" ? "b" : charStr;
}
$("#foo").keypress(function(evt) {
if (evt.which) {
var charStr = String.fromCharCode(evt.which);
var transformedChar = transformTypedChar(charStr);
if (transformedChar != charStr) {
var start = this.selectionStart, end = this.selectionEnd, val = this.value;
this.value = val.slice(0, start) + transformedChar + val.slice(end);
// Move the caret
this.selectionStart = this.selectionEnd = start + 1;
return false;
}
}
});