PDA

View Full Version : Firefox and keydown event inside DIV elements


AsGoodAsItGets
22 Jul 2005, 06:09 AM
Hello,
can anybody please explain to me why the following code does not work in Firefox as it does in IE?
In general, how can I capture keydown events inside DIVs with firefox?



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>keydown test</title>
</head>
<script language="JavaScript" type="text/javascript">
function keydown(evt)
{
obj = document.getElementById("test");
if(obj)
{
if(window.event)
var key = evt.keyCode;
else if(evt.which)
var key = evt.which;
else
return true;
obj.innerHTML += "user pressed '"+String.fromCharCode(key)+"' ("+key+")<br>";
}
}
</script>
<body>
<div id="test" style="border: 1px solid black; padding: 8px; position: absolute; overflow: visible; left: 0px; top: 0px; -moz-box-sizing: border-box; width:400px; height:100px; font-family:tahoma; font-size:11px; background-color:#CCCC66;" onkeydown="return keydown(event);">
</div>
</body>
</html>


Thanks in advance.
Rambo Tribble
22 Jul 2005, 11:23 AM
You may be overthinking this. Consider:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
</style>
<script type="text/javascript">
</script>
</head>
<body onkeydown="alert(String.fromCharCode(event.keyCode));">
</body>
</html>


An additional complication may be that focus is not supported on all elements in most browsers, later IE being the exception.