Skip to content

JavaScript KeyCode’ları

Merhaba arkadaşlar,

JavaScript tarayıcı taraflı çalışan günümüz web sitelerinde çok sık kullanılan bir programlama dilidir. Çoğu zamanda sayfamızda bir işlem yapacağımız bazen bu tuş kodlarını ihtiyacımız olabilir. En basit örnek olarak yandaki giriş formunda jQuery ile Enter’a basılınca formun gönderilmesini sağladık. Çünkü yandaki formdaki buton submit işlevinde değildir. Sadece butondur. Enter tuşuna basıldığı zaman formu submit etmesini biz bildiriyoruz. İstersek Escape tuşuna basıldığı zamanda formun submit edilmesini sağlayabilirdik. Aşağıdaki tabloda klavyenizde bulunan gerekli tuş kodları bulunmaktadır.

Basılan tuş Tuş Kodu
backspace 8
tab 9
enter 13
shift 16
ctrl 17
alt 18
pause/break 19
caps lock 20
escape 27
page up 33
page down 34
end 35
home 36
sol tuşu 37
üst tuşu 38
sağ tuşu 39
aşağı tuşu 40
insert 45
delete 46
0 48
1 49
2 50
3 51
4 52
5 53
6 54
7 55
8 56
9 57
a 65
b 66
c 67
d 68
e 69
f 70
g 71
h 72
i 73
j 74
k 75
l 76
m 77
n 78
o 79
p 80
q 81
r 82
s 83
t 84
u 85
v 86
w 87
x 88
y 89
z 90
numpad 0 96
numpad 1 97
numpad 2 98
numpad 3 99
numpad 4 100
numpad 5 101
numpad 6 102
numpad 7 103
numpad 8 104
numpad 9 105
çarpma işareti 106
toplama işaret 107
eksi işareti 109
ondalık işareti 110
bölme işareti 111
f1 112
f2 113
f3 114
f4 115
f5 116
f6 117
f7 118
f8 119
f9 120
f10 121
f11 122
f12 123
num lock 144
scroll lock 145
eşittir 187
virgül 188
tire 189
slaş 191
ter slaş 220
tek tırnak 222

Bu keycode’larını kullanarak bir deneme yapalım:

<!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 xml:lang="tr" lang="tr">  
  
<head>  
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />  
    <meta name="author" content="oralunal" />  
  
    <title>keyCode - www.trkodlama.com</title>  
    <script src="jQuery_dizini/jQuery.js" type="text/javascript"></script>  
    <script type="text/javascript">  
        $(document).ready(function(){  
            $("#gizli").hide();  
            $(document).keyup(function(e) {  
                if(e.keyCode == '13') { //Enter tuşu  
                    $("#gizli").fadeIn();  
                }  
                else if(e.keyCode == '') { //Escape tuşu  
                    $("#gizli").fadeOut();  
                }  
            });  
        });  
    </script>  
</head>  
<body>  
<div>Bu div herkes tarafında görünecektir.</div>  
<div id="gizli">Bu div Enter tuşuna basıldığı zaman görünecek Escape tuşuna basıldığı zaman kaybolacaktr.</div>  
</body>  
</html> 

Kullanımı gayet basit ve anlaşılır. Bu sayede $.keyup() fonksiyonunu da anlatmış oldum. Umarım faydalı olmuştur.

Kolay gelsin,

TR Kodlama GitHub'da!

TR Kodlama'da yer alan makaleleri GitHub üzerinden düzenleyebileceğinizi biliyor muyudunuz? Harika değil mi? Bu makale ile ilgili düzenleme yapmak isterseniz aşağıdaki butona tıklayınız!

GitHub'da Görüntüle ve Düzenle!