Functie die teruggeeft welke toets werd ingedrukt
Op mijn website - geschreven in PHP - is onder meer een fotogalerij.
Door op knoppen te klikken kan er vooruit en achteruit gebladerd worden.
Maar met de cursortoetsen zal dat ook kunnen.
Dus ik ben op zoek naar een functie die teruggeeft welke toets werd ingedrukt.
Ongeveer zo:
Kan iemand mij vertellen wat er bij de vraagtekens moet staan?
Ik weet dan zelf hoe ik de puntjes moet vervangen.
Door op knoppen te klikken kan er vooruit en achteruit gebladerd worden.
Maar met de cursortoetsen zal dat ook kunnen.
Dus ik ben op zoek naar een functie die teruggeeft welke toets werd ingedrukt.
Ongeveer zo:
Code (php)
1
2
3
4
5
2
3
4
5
function key()
{ ???????? }
if (key=="ArrowLeft") {......};
if (key=="ArrowRight") {......};
{ ???????? }
if (key=="ArrowLeft") {......};
if (key=="ArrowRight") {......};
Kan iemand mij vertellen wat er bij de vraagtekens moet staan?
Ik weet dan zelf hoe ik de puntjes moet vervangen.
Gevonden:
https://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes
Zo pas ik het toe om door paginas te bladeren of naar een bepaalde pagina te gaan.
https://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes
Zo pas ik het toe om door paginas te bladeren of naar een bepaalde pagina te gaan.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<?php
$picRecipe = ( isset($picRecipe) ? ( $picRecipe == 1 ? 1 : 0 ) : 0 );
$isRecipe = ( isset($isRecipe) ? ( $isRecipe == 1 ? 1 : 0 ) : 0 );
$thePid = ( isset($thePid) ? ( $thePid == 1 ? 1 : $thePid ) : 1 );
?>
<script>
// http://www.cambiaresearch.com/articles/15/javascript-key-codes
if (document.addEventListener)
{
document.addEventListener("keydown",checkKey);
} else if (document.attachEvent) {
document.attachEvent("onkeydown", checkKey);
}
function checkKey(e)
{
e = e || window.event;
if (e.keyCode == '27')
{
// Escape
<?php if ( $picRecipe == 1 )
{ ?>
window.location.href = '/recipes/?pid=<?php echo $thePid; ?>';
<?php } else if ( $isRecipe == 1 ) { ?>
window.location.href = '/store/?pid=<?php echo $thePid; ?>';
<?php } ?>
} else if (e.keyCode == '37') {
// left arrow
<?php if ( !$isTheFirst )
{ ?>
window.location.href = '?prev=<?php echo $thePid; ?>';
<?php } ?>
} else if (e.keyCode == '38') {
// up arrow
<?php if ( !$isTheFirst )
{ ?>
window.location.href = '?pid=1';
<?php } ?>
} else if (e.keyCode == '39') {
// right arrow
<?php if ( !$isTheLast )
{ ?>
window.location.href = '?next=<?php echo $thePid; ?>';
<?php } ?>
}
else if (e.keyCode == '40') {
// down arrow
<?php if ( !$isTheLast )
{ ?>
window.location.href = "?pid=999999";
<?php } ?>
}
}
</script>
$picRecipe = ( isset($picRecipe) ? ( $picRecipe == 1 ? 1 : 0 ) : 0 );
$isRecipe = ( isset($isRecipe) ? ( $isRecipe == 1 ? 1 : 0 ) : 0 );
$thePid = ( isset($thePid) ? ( $thePid == 1 ? 1 : $thePid ) : 1 );
?>
<script>
// http://www.cambiaresearch.com/articles/15/javascript-key-codes
if (document.addEventListener)
{
document.addEventListener("keydown",checkKey);
} else if (document.attachEvent) {
document.attachEvent("onkeydown", checkKey);
}
function checkKey(e)
{
e = e || window.event;
if (e.keyCode == '27')
{
// Escape
<?php if ( $picRecipe == 1 )
{ ?>
window.location.href = '/recipes/?pid=<?php echo $thePid; ?>';
<?php } else if ( $isRecipe == 1 ) { ?>
window.location.href = '/store/?pid=<?php echo $thePid; ?>';
<?php } ?>
} else if (e.keyCode == '37') {
// left arrow
<?php if ( !$isTheFirst )
{ ?>
window.location.href = '?prev=<?php echo $thePid; ?>';
<?php } ?>
} else if (e.keyCode == '38') {
// up arrow
<?php if ( !$isTheFirst )
{ ?>
window.location.href = '?pid=1';
<?php } ?>
} else if (e.keyCode == '39') {
// right arrow
<?php if ( !$isTheLast )
{ ?>
window.location.href = '?next=<?php echo $thePid; ?>';
<?php } ?>
}
else if (e.keyCode == '40') {
// down arrow
<?php if ( !$isTheLast )
{ ?>
window.location.href = "?pid=999999";
<?php } ?>
}
}
</script>
merk op dat je het dan echt over de key hebt en niet over het plaatje of teken dat erop staat. De "arrow left" kan dus meermaals op de toetsenbord zitten en dus ook meerdere nummers hebben.
Het is ook nog mogelijk om (via een omweggetje) te onderscheiden of de linker- of rechtershiftkey gebruikt wordt.
Het is ook nog mogelijk om (via een omweggetje) te onderscheiden of de linker- of rechtershiftkey gebruikt wordt.
Ik ben niet zo heel gek op switch statements, maar deze leent zich er wel heel erg voor, ipv al die else-if's.
Het heeft even geduurd om mijn website aan te passen aan het voorbeeld van Adoptive Solution. Dus pas nu mijn oprechte dank - en tegelijkertijd een vraag: hoe komt het dat Escape in Chrome en Internet Explorer altijd werkt, maar in Firefox en Edge alleen als ik ook op Shift druk?
e.keyCode is "deprecated", zoals dat heet. Ik zou het zo doen:
Zoals aanbevolen heb ik de code "gemoderniseerd" en nu werkt het met alle browsers. Hartelijk dank voor de tip.




