onkeypress in IE

Door Jelle - op 16-11-2006 10:05

424 views

Ik wil dat er een functie wordt uitgevoert om het moment dat je op een toets drukt. Dus onkeypress leek mij het meest voor de hand liggent. In FF (2) werkt dit goed en krijg ik 'KeyCode: (getal)' in beeld. In IE(7) daarintegen krijg ik niets te zien.

Weet iemand wat er hier fout is?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Test</title>
    <script language="javascript" type="text/javascript">
	  function keyevent(event){	  
       	document.getElementById('keyinfo').innerHTML = 'KeyCode: ' + event.keyCode;
	  }
    </script>
  </head>
  <body onkeypress="keyevent(event);">
    <div id="keyinfo"></div>
  </body>
</html>

Martijn Wieringa

16-11-2006 11:03

Aantal opmerkingen:

- Het woord 'event' is gereserveerd, dit is buggy als je um gebruiktr als variabele..
- onkeypressed is volgens mij geen standaard event (weet ik niet helemaal zeker), maar ik gebruik liever 'onkeydown'.

Bij de meeste browsers wordt standaard de event meegegeven aan de functie, maar da's niet altijd zo, daarom moet je, voor berowser compatabiliteit, ff de if(window.event) check doen..


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<script language="javascript" type="text/javascript">

function keyevent(e)
{
	if(window.event)
	{
		e = window.event;
	}

	document.getElementById('keyinfo').innerHTML = 'KeyCode: ' + e.keyCode;
}

document.onkeydown = keyevent;

</script>
</head>
<body>
<div id="keyinfo"></div>
</body>
</html>

Jelle -

16-11-2006 11:21

- onkeypressed is volgens mij geen standaard event (weet ik niet helemaal zeker), maar ik gebruik liever 'onkeydown'.

Dit is wel een standaard event :P

En ik wil niet 'onkeydown' gebruiken, want als jij die ingedrukt houd dan blijft hij die functie uitvoeren. Bij 'onkeypress' doet hij het maar 1 keer als je hem ingedrukt houd. Dat is het verschil tussen die 2 events.

Verder zal ik het aanpassen naar jouw manier, maar dan nog wel met 'onkeypress'

Even kijken of het werkt

Edit:
Je voorbeeld werkt, maar niet met 'onkeypress' (wel in FF niet in IE)

En als ik toch 'onkeydown' gebruik en ik verander:
document.getElementById('keyinfo').innerHTML = 'KeyCode: ' + e.keyCode;
naar:
document.getElementById('keyinfo').innerHTML += 'KeyCode: ' + e.keyCode;

En ik houw een knop ingedrukt, dan krijg ik deze steeds vaker in beeld ipv maar 1 keer.

Dus hij blijft die functie uitvoeren .. :-(

Martijn Wieringa

16-11-2006 11:39

En zo iets dan? :)


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<script language="javascript" type="text/javascript">

function keyPressed(e)
{
    if(window.event)
    {
        e = window.event;
    }

    document.getElementById('keyinfo').innerHTML = 'KeyCode: ' + e.keyCode;
    document.onkeydown = null;
}

function keyReleased(e)
{
    document.onkeydown = keyPressed;
}


document.onkeydown = keyPressed;
document.onkeyup = keyReleased;

</script>
</head>
<body>
<div id="keyinfo"></div>
</body>
</html>

Martijn Wieringa

16-11-2006 11:44

Hmm, nog en kleine toevoeging, anders zou je kunnen 'frauderen' door een 2e key in te drukken en die weer los te laten.. zodat je de 'onkeyup' weer triggerd.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<script language="javascript" type="text/javascript">

var iKeyCode = -1;

function keyPressed(e)
{
    if(window.event)
    {
        e = window.event;
    }

	iKeyCode = e.keyCode;
    document.onkeydown = null;

    document.getElementById('keyinfo').innerHTML = 'KeyCode: ' + e.keyCode;
}

function keyReleased(e)
{
    if(window.event)
    {
        e = window.event;
    }

	if(iKeyCode == e.keyCode)
	{
		iKeyCode = -1;
		document.onkeydown = keyPressed;
	}
}


document.onkeydown = keyPressed;
document.onkeyup = keyReleased;

</script>
</head>
<body>
<div id="keyinfo"></div>
</body>
</html>

Jelle -

16-11-2006 11:47

Tanxz man!

Zo reageert hij goed :-)
Slimme oplossing.

Bedankt!

Martijn Wieringa

16-11-2006 11:55

Lang leefuh PHP(en JS/css/htaccess/enz)hulp.nl :P

Jelle -

16-11-2006 11:58

Lol idd :-)

Reageren

Inloggen om te reageren