Entering in contentEditable area

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

I've set up a div contentEditable and like to see following to happen:

When typing a number of 1 to 4 immediately after an alphabetic letter,
it would become corresponding superscript.  But if the user leaves a
space after the letter, then types a number, or in any other way, it
will not change to superscript, but appear in regular size.

The superscripts are to indicate the tones of Chinese language.  I
guess that Javascript has to be employed, but my knowledge on that is
quite limited.  Following is a part of my code. It doesn't work at all.

<script type='text/javascript'>

function sup () {
var a;
document.write ('<sup>' + a + '</sup>');

<div contentEditable>
Start to type here.


Following is the url:

Thanks in advance.
Dung Ping

Site Timeline