| 1 |
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> |
|---|
| 2 |
<html> |
|---|
| 3 |
<head> |
|---|
| 4 |
<title> |
|---|
| 5 |
Example |
|---|
| 6 |
</title> |
|---|
| 7 |
<script src="prototype.js" type="text/javascript"></script> |
|---|
| 8 |
<script language="javascript" type="text/javascript"> |
|---|
| 9 |
|
|---|
| 10 |
|
|---|
| 11 |
|
|---|
| 12 |
function maskKeyPress(objEvent) { |
|---|
| 13 |
var iKeyCode, strKey; |
|---|
| 14 |
|
|---|
| 15 |
var strUserAgent = navigator.userAgent.toLowerCase(); |
|---|
| 16 |
var iKeyCode = objEvent.keyCode || objEvent.which; |
|---|
| 17 |
var strKey = String.fromCharCode(iKeyCode); |
|---|
| 18 |
alert("KeyCode = " + iKeyCode + "\nCharacter =" + strKey); |
|---|
| 19 |
} |
|---|
| 20 |
|
|---|
| 21 |
window.onload = function () { |
|---|
| 22 |
var field = $("label1"); |
|---|
| 23 |
Event.observe(field, "keypress", maskKeyPress, true ); |
|---|
| 24 |
} |
|---|
| 25 |
</script> |
|---|
| 26 |
<style type="text/css"> |
|---|
| 27 |
body, p, td { font-family: Verdana, Arial, Helvetica; font-size: |
|---|
| 28 |
9pt; } |
|---|
| 29 |
</style> |
|---|
| 30 |
</head> |
|---|
| 31 |
<body> |
|---|
| 32 |
<h1>Example</h1> |
|---|
| 33 |
<p>For this example, try typing a capitalized character on each text field. You will see an alert that displays the |
|---|
| 34 |
character and the keycode corresponding to the key you pressed. |
|---|
| 35 |
And the keyCode is different when using Event.observe (With the patch the keyCode would be the same.)</p> |
|---|
| 36 |
<form name="tempForm" action="#"> |
|---|
| 37 |
<p><input type="text" id="label1" name="label1" size="20"></p> |
|---|
| 38 |
<p><input type="text" id="label2" name="label2" |
|---|
| 39 |
onkeypress="maskKeyPress(window.event);" size="20"></p> |
|---|
| 40 |
</form> |
|---|
| 41 |
</body> |
|---|
| 42 |
</html> |
|---|