...

View Full Version : function document.onkeydown()



shadowsai
11-04-2012, 08:52 AM
Well, I'm trying to program something so that when I press down a key, it'll jump down to that respective anchor bookmark. This Javascript seems to work fine in IE (WOAH, I KNOW), but doesn't do anything in Chrome, Firefox, or any of the other major browsers.


<head>
<script language="javascript">
function document.onkeydown(){
var str = String.fromCharCode(event.keyCode);
str = str.toLowerCase();
if (str == "1" ||
str == "97" ||
str == "2" ||
str == "98" ||
str == "3" ||
str == "99" ||
str == "4" ||
str == "100" ||
str == "5" ||
str == "101" ||
str == "6" ||
str == "102" ||
str == "7" ||
str == "103" ||
str == "8" ||
str == "104" ||
str == "9" ||
str == "105") {
document.location.hash = str;
} else if (str == "p") {
document.location.hash="prechorus";
} else if (str == "c") {
document.location.hash="chorus";
} else if (str == "v") {
document.location.hash="chorus2";
} else if (str == "b") {
document.location.hash="bridge";
} else if (str == "t") {
document.location.hash="title";
}/* else {
event.returnValue=false;
} */
}
</script>
That all goes in the <head></head> sections of the page.

And the chorus2 section I want to jump to (for example), which is in the <body></body> section.

<a name="chorus2">This is a chorus</a>

devnull69
11-04-2012, 09:40 AM
What? This works in IE? I really really cannot believe that

To assign an event handler for keydown you'll have to use something like this


window.onkeydown = function() {
...
};

yaseenyahya
11-04-2012, 02:20 PM
use (event.which) simple.

shadowsai
11-05-2012, 07:33 AM
What? This works in IE? I really really cannot believe that

To assign an event handler for keydown you'll have to use something like this


window.onkeydown = function() {
...
};


So right now, based on that, I have this

<script language="javascript">
window.onkeydown = function(e) {
if(e.keyCode == 49) // if 1 (top row) is pressed
document.location.hash="1"; // goto Verse 1
if(e.keyCode == 50) // if 2 (top row) is pressed
document.location.hash="2"; // goto Verse 2
if(e.keyCode == 51) // if 3 (top row) is pressed
document.location.hash="3"; // goto Verse 3
if(e.keyCode == 52) // if 4 (top row) is pressed
document.location.hash="4"; // goto Verse 4
if(e.keyCode == 53) // if 5 (top row) is pressed
document.location.hash="5"; // goto Verse 5
if(e.keyCode == 54) // if 6 (top row) is pressed
document.location.hash="6"; // goto Verse 6
if(e.keyCode == 55) // if 7 (top row) is pressed
document.location.hash="7"; // goto Verse 7
if(e.keyCode == 56) // if 8 (top row) is pressed
document.location.hash="8"; // goto Verse 8
if(e.keyCode == 57) // if 9 (top row) is pressed
document.location.hash="9"; // goto Verse 9
if(e.keyCode == 67) // if c is pressed
document.location.hash="chorus"; // goto Chorus
if(e.keyCode == 66) // if b is pressed
document.location.hash="bridge"; // goto Bridge
if(e.keyCode == 86) // if v is pressed
document.location.hash="chorus2"; // goto Chorus2
if(e.keyCode == 84) // if t is pressed
document.location.hash="title"; // goto Title
};
</script>

What I find strange is that in Chrome, if I press a button (say c, for Chorus), it goes down. Now the weird part is, that if I scroll up/down with my mousewheel, then press c again, it does not goes back to the chorus (which is intended). However it does this in IE and Firefox. Is it possible to replicate this behaviour in Chrome, so that when I scroll with my mousewheel/page down/up/ up arrow/ down arrow and then press a button, that it jumps back to that position?

Thanks for all your help so far! Also, is there a more elegant way of doing what I've written?

felgall
11-05-2012, 09:06 AM
Note that IE is the only browser with a separate event object - with all the other browsers the event gets passed to the event handler as one of the parameters.

Also IE uses charCode while all other browsers use keyCode.

See http://localhost/js-ex/events08.php for a cross browser function to get the key that was pressed.

Philip M
11-05-2012, 09:13 AM
<script type = "text/javascript">

document.onkeydown = function(ev) {
var key;
ev = ev || event;
key = ev.keyCode;
alert ("Keycode = " + key);

which = String.fromCharCode(key).toUpperCase();
if (key>=48 && key<=90) {
alert ("You pressed the " + which + " key");
}

}
</script>

Dormilich
11-05-2012, 10:20 AM
What? This works in IE? I really really cannot believe that


I think it suffices to define the event property. whether the function is defined via (anonymous) function statement or via function declaration doesn’t seem to matter.

felgall
11-05-2012, 07:49 PM
<script type = "text/javascript">

document.onkeydown = function(ev) {
var key;
ev = ev || event;
key = ev.keyCode;
alert ("Keycode = " + key);

which = String.fromCharCode(key).toUpperCase();
if (key>=48 && key<=90) {
alert ("You pressed the " + which + " key");
}

}
</script>

If you use:


document.onkeydown = function(event) {

then you wouldn't need:


ev = ev || event;

and then just use event instead of ev



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum