replacing characters in textarea on keyPress or keyDown events

way2many · Oct 25, 2004

Hi,
I'd like to have a script for textarea for typing with some forign symbols and character.
I'd like to give users opportunity to re-assign key values if they will not like current keyboard layout.

Basically, the only thing I need is to know how to re-assing letters to different keys:
if I hit "abc" keys - "xyz" or whatever foreign letteres assigned to those keys should appear in the textarea.

Any help would be appreciated!

Thank you

dwarfthrower · Oct 25, 2004

A quick and dirty effort to get you started... uses an array to store the replacement values along with the values to be replaced. In this case, replaces the a i e o u with their accented versions.

Code:

<html>
<head>
<script>
//[from, to] pairs of key codes.
var codeMap = new Array([97,224], [101,232], [105,236], [111,242], [117,249]);

function handleKeyPress(){
  //get the key that was pressed
  var code = event.keyCode;
  //look it up in the array
  for(var i = 0; i < codeMap.length; i++){
   if(codeMap[i][0] == code){
    //if we find it, get the replacement value
    code = codeMap[i][1];
   }
  }
  //reassign the value
  event.keyCode = code;
}
</script>
</head>
<body>
<textarea onkeypress="handleKeyPress()"></textarea>
</body>
</html>

_{Never be afraid to share your dreams with the world.

There's nothing the world loves more than the taste of really sweet dreams.}

way2many · Oct 26, 2004

dwarfthrower,
thank you very much!

Is there a way to use actual characters in array instead of key codes?

Regards,
Way M.

chessbot · Oct 26, 2004

Modification:

The for loop will run until the end of the array, regardless of whether or not a value was found. Therefore:

Code:

  for(var i = 0; i < codeMap.length; i++){
   if(codeMap[i][0] == code){
    //if we find it, get the replacement value
    code = codeMap[i][1];
    [red]break;[/red]
   }
  }

so as to break out when there is a match.

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series

dwarfthrower · Oct 26, 2004

Good performance tip Chessbot... one we should all be mindful of.

way2many said:
Is there a way to use actual characters in array instead of key codes?

Indeed... just needs a little processing either side of the key code to work. Here's the ammended code:

Code:

<html>
<head>
<script>
//[from, to] pairs of characters.
var charMap = new Array(["a","à"], ["e","è"], ["i","ì"], ["o","ò"], ["u","ù"]);
function handleKeyPress(){
  var code = event.keyCode;
  //convert code to character
  var char = String.fromCharCode(code);
  for(var i = 0; i < charMap.length; i++){
   if(charMap[i][0] == char){
    char = charMap[i][1];
    break;
   }
  }
  //convert character back to code
  code = char.charCodeAt(0);
  event.keyCode = code;
}
</script>
</head>
<body>
<textarea onkeypress="handleKeyPress()"></textarea>
</body>
</html>

_{Never be afraid to share your dreams with the world.

There's nothing the world loves more than the taste of really sweet dreams.}

way2many · Oct 26, 2004

Dwarfthrower and Chessbot,
thank you for your great help!

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

replacing characters in textarea on keyPress or keyDown events

way2many

Technical User

dwarfthrower

Programmer

way2many

Technical User

chessbot

Programmer

dwarfthrower

Programmer

way2many

Technical User

Similar threads

Part and Inventory Search

Sponsor