Keypress irregularity: IE vs. FF function call timing?

[mens libertina]

Hello,

I am programming a little game, and I want the focus to move from one
input box to the next as the user types. I have image-input pairs so
the user is typing a letter under a picture. (Similar to word jumbles
or cryptograms.) I'm also keeping track of the user's complete guess
in a cookie so they can save their game. I get the input; if it's a
letter, I capitalize it and update the cookie; then move the focus to
the next input box. It works as I expect in FF, but not in IE.

In IE, it just capitalizes the letter, but won't move the focus. Now,
if I comment out the cookie handling section or type a number, it will
update the current input box, move to the next, and put in the user's
input (numbers, lowercase letters, etc) there too. So something must
be happening in the cookie handling section, although it works as
expected and the JavaScript Console doesn't display any errors or
warnings.

I'm wondering if the JavaScript run-time is somehow not finishing
everything before it calls the last line, MoveFocus(). BTW, I've tried
putting MoveFocus() in the onchange= attribute but it was never
triggered. I guess keypress + updating the value doesn't count as a
change.

Thanks for any hints, debugging, or insight you can provide.



HTML:
<div class="pair">
<img id="q1" src="img.jpg" alt="image" class="black" />
<br />

<input id="u1" type="text" class="guess" size="1" maxlength="1"
value=""
onFocus="Highlight(this);" onBlur="UnHighlight(this);"
onKeyPress="ReplaceVal(event);" />
</div>

JavaScript:
function MoveFocus( objid )
{
var id = objid.slice( 1 );
id++;
document.getElementById( "u"+id ).focus();
return true;
}

function ReplaceVal(e)
{
// Update interface
var keynum;
var numcheck;
var obj;

// Get the value of the user's input
if(window.event) // IE
{
keynum = e.keyCode;
obj = e.srcElement;
}
else if(e.which) // Netscape/Firefox/Opera
{
keynum = e.which;
obj = e.target;
}
var keychar = String.fromCharCode(keynum)

// Ignore numbers and punctuation
recheck = /[a-zA-Z]/;
if( !recheck.test( keychar) )
{ obj.value = ' '; }
else
{
obj.value = keychar.toUpperCase();

// Find the guess cookie
var oldguess;
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++)
{
var c = ca;
var pair = c.split('=');
if( pair[0] == 'guess' )
{
oldguess = pair[1];
break;
}
}

// Update the cookie
var lind = obj.id.slice(1);
var newguess = oldguess.slice( 0, lind) + obj.value +
oldguess.slice( lind+1 );
document.cookie = 'guess='+newguess+';';
}

MoveFocus( obj.id );
return true;
}

 

[mens libertina]

Well, there were errors in the cookie section. I was thinking PHP and
forgot the second argument for slice. Fixing that error was one of many
iterations. Working Javascript function follows:


function ReplaceVal(e)
{
var keynum;
var numcheck;
var obj;

// Get the value of the user's input
if(window.event) // IE
{
keynum = e.keyCode;
obj = e.srcElement;
}
else if(e.which) // Netscape/Firefox/Opera
{
keynum = e.which;
obj = e.target;
}
var keychar = String.fromCharCode(keynum)

// Ignore numbers and punctuation
recheck = /[a-zA-Z]/;
if( !recheck.test(keychar) )
{
obj.value = '';
}
else
{
obj.value = keychar.toUpperCase();

// Update the cookie
var oldguess = getCookie( "guess" );

if( oldguess )
{
var lind = obj.id.slice(1);
var preslice = oldguess.substring(0,lind);
var postslice = oldguess.substring( ++lind, oldguess.length );

var newguess = preslice+obj.value+postslice;
setCookie("guess", newguess );
}
}

MoveFocus( obj.id );
}