Öne Çıkan Yayın

Uzak Masaüstü Bağlantısı ve Modem Port Ayarı

İyi günler bu konumuzda uzak masaüstü bağlantısı ve modem port ayarını anlatacağım. Normalde uzak masaüstü bağlantısı ayarını açtığımızda ye...

4 Eylül 2012 Salı

Jquery .keypres() özelliği

       jQuery keypress klavyeden basılan tuşları kontrol etmemize yarayan bir fonksiyondur. keypress klavyeden bir tuşa basıldığı anda aktif olur. Örneğin klavyeden “m” tuşuna basıyorsunuz. keypress “m” tuşuna bastığınız anda, “m” tuşu işlem görmeden aktif olur. Kullanım şekli aşağıdaki gibidir. id değeri test olan bir input a nasıl uygulayacağımıza bir bakalım.

<input type="text" id="test" />
$("#test").keypress();
test input una keypress fonksiyonumuzu atamış olduk. Bu atamadan sonra yapmak istediğimiz işlemleri keypress içinde bir function oluşturarak düzenliyoruz.
$("#test").keypress(function(){
 // yapmak istediklerimizi bu kısımda düzenliyoruz.
});
Dilerseniz küçük bir örnek yapalım. Sayfamızda “m” tuşuna basıldığında mesaj kutusu çıkartalım.
$(document).keypress(function (event) {
 var Karakter = String.fromCharCode(event.which);

 // klavyeden basılan karakteri "Karakter" isminde bir değişkene aktarıyoruz.
 // yakaladığımız değerin "m" olup olmadığını kontrol ediyoruz.
 // eğer "m" ise mesej kutusu çıkartıyoruz.

        if (Karakter == "m") {

         alert();
        }
});
Eğer bu ne işimize yarar derseniz, mesela örnekteki mantığı kullanarak sayfamızda kısa yollar yapabiliriz.
Bu durumu daha iyi algılayabilmemiz için, bir input a yapılan girişleri kontrol edelim. Örnek olarak input a sadece rakamların girişine izin verelim.
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>jQuery - keypress()</title>
// Jquery kütüphanemizi çağırıyoruz.
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#KeypressTest").keypress(function (event) {
                Code = event.keyCode ? event.keyCode : event.charCode ? event.charCode : 0;
                // klavyeden basılan tuşun keyCode değerini alarak "Code" değişkenine aktarıyoruz.
                // rakamların (0, 1, 2, 3, 4, 5, 6, 7, 8, 9) keyCode değerleri 48 ile 57 arasındadır.
                // bir sonraki adımda klavyeden gelen değerin 48 ile 57 arasında olup olmadığını kontrol ediyoruz.
                if (Code >= 48 && Code <= 57) {
                    return true;
                    // eğer girilen değer 48 ile 57 arasındaysa basılan tuşa izin veriyoruz.
                }
                else {
                    return false;
                    // eğer girilen değer bu aralıkta değilse basılan tuşa izin vermiyoruz.
                }
            });
        });
    </script>
</head>
<body>
<input type="text" id="KeypressTest" />
</body>
</html>
Örnek :

1. Örnek - Rakam Kontrolü
Lütfen bir değer girin

Bu bölüme sadece rakam girişine izin verilmektedir.
2. Örnek - Kısa yol tuşu oluşturma.

Ayrıca aynı konu ile ilgili diğer örneğimizide test edebilirsiniz. Bunun için lütfen "m" tuşuna basınız.

Hiç yorum yok:

Yorum Gönder