Merhabalar, bu yazımda jQuery ile keydown, keypress ve keyup event’larının kullanımlarını ve farklarını bir örnekle göstermeye çalışacağım.
Kısaca ne iş yaptıklarından bahsedersek,
keydown : Klavyeden bir tuşa basıldığı anda çalışır.
keypress : Klavyeden tuşa basıldığında ve basılı tutulduğu sürece çalışır.
keyup : Klavye tuşuna bastıktan sonra parmağımızı çektiğimizde çalışır.
Şimdi her birini birer örnekle pekiştirmeye çalışalım.
Keydown ve Keypress örneği farkları
Bu iki event birbirine çok benzemektedir, farklarını anlayabilmek için 2 farklı örnek göstereceğim.
Örnek-1 için ctrl, shift, backspace gibi özel karakterlere bastığınızda keydown event’inin tetiklendiğini görecekseniz, fakat keypress event’i tetiklenmeyecektir.
Örnek-2 için ise klavydeki tuşların ascii karşılıklarını ekrana yazdırdım, keydown büyük küçük harfe duyarlı değildir, keypress event’inde ise büyük küçük harf duyarlılığı vardır.
Keyup örneği;
Burada keyup event’i örneğinde klavyeye basıp her tuşu bıraktığımızda sayı artar. Farkı anlamak için klavyeye basılı tutabilirsiniz.
Keydown ve Keyup örneği;
Son örneğimizde ise keydown ve keyup event’larını aynı anda kullanarak iyice pekişmesini sağlayalım. Burada tuşa basıldığı anda textbox sarı olur, klavyeden parmağımızı çektiğimizde ise renk pembeye döner.
Umarım bu 3 event’de anlaşılabilmiştir. Sorularınız ya da anlaşılmayan bir yer varsa lütfen yorumlarda belirtin. Kolay gelsin hepinize 🙂