onKeyPress Olayı (Event)

JavaScript onKeyPress olayı (event), ilgili elementin içinde veya üzerinde kullanıcı bir tuşa bastığı veya basılı tuttuğu zaman tetiklenir. HTML onKeyPress özelliği element üzerinde keypress olayı gerçekleştiği zaman çalıştırılacak fonksiyonun veya betiğin (script) belirtilmesini sağlar.

HTML dahilindeki sadece tek bir fonksiyon belirtilebilen bu tip olay yönetim fonksiyonlarına olay tutucu (event handler) ismi verilir. Fakat, HTML DOM'da birden fazla olay yönetim fonksiyonu belirtilebildiği için olay tutucusu isminden ziyade olay dinleyici (event listener) ismi kullanılmaktadır. DOM'da olay dinleyici fonksiyonlar attachEvent ve addEventListener fonksiyonları ile ilgili elemente eklenebilir/bağlanabilir.

HTML Sözdizimi

<element onkeypress="betik" > ... </element>

DOM Sözdizimi

element.onkeypress = fonkBetik;

betik = element.onkeypress

betik	onkeypress olayı tetiklendiğinde çalıştırılacak betik (script) kodlarını belirtir.
fonkBetik	onkeypress olayı tetiklendiğinde çalıştırılacak fonksiyon adını veya betik kodlarını belirtir.

Dönüş Değeri

betik

Fonksiyon belirtildiyse fonksiyon gövdesi veya betik kodları döner.

Örnek

Aşağıdaki örnek, onKeyDown, onKeyPress ve onKeyUp olay tutucularının metin kutusu (textbox) girişinde bir tuşa basıldığı zaman gerçekleşme sırasını göstermektedir.

<html>
<head>
    <title>JavaScript onKeyDown, onKeyPress ve onKeyUp Olay tutucuları</title>
<script type="text/javascript">
var Sira = 1;
function On_KeyDown() {
    document.getElementById('OnDownBilgi').innerHTML = Sira +". : onKeyDown oldu!";
    Sira++; }
    
function On_KeyPress() {
    document.getElementById('OnPressBilgi').innerHTML = Sira +". : onKeyPress oldu!";
    Sira++; }
    
function On_KeyUp() {
    document.getElementById('OnUpBilgi').innerHTML = Sira +". : onKeyUp oldu!";
    Sira++; }
    
function Temizle() {
    document.getElementById('Giris').value = "";
    document.getElementById('OnDownBilgi').innerHTML = "";
    document.getElementById('OnPressBilgi').innerHTML = "";
    document.getElementById('OnUpBilgi').innerHTML = "";
    Sira = 1; }
</script>
</head>
<body>
<input id="Giris" type="text" onKeyDown="On_KeyDown()" onKeyPress="On_KeyPress()" onKeyUp="On_KeyUp()">
<div id="OnDownBilgi" style="color:red;"></div>
<div id="OnPressBilgi" style="color:red;"></div>
<div id="OnUpBilgi" style="color:red;"></div>
<input type="button" value="Temizle" onClick="Temizle()">
</body>
</html>

Canlı Sonuç

Elementler

keypress olayının gerçekleşebileceği/kontrol edilebileceği HTML etiketleri/elementleri