pythontr.com
html kodu aşağıdkai şekilde olan bir örnek form üzerinde örnekleyelim.
<b>Kredi Kartı Numaranızı Giriniz? Örnek(1234-5678-9012-3456):</b> <form name="kart"> <input type="text" name="kart1" size=4 maxlength=4> <input type="text" name="kart2" size=4 maxlength=4> <input type="text" name="kart3" size=4 maxlength=4> <input type="text" name="kart4" size=4 maxlength=4> </form>
Yukarıdaki formda 16 haneli sayıyı 4 kısıma ayrılmış bir şekilde hazırlanan form vardır. Her textbox'ın uzunluğunu 4 olarak ayarladık. Ve textbox'ın maximum uzunluğu olduğunda otomotik olarak bir sonraki textbox'a geçmesini istiyoruz.
Bunu aşağıdaki şekilde javascript kodu ile sağlayabiliriz.
<script> function autotab(current,to){ if (current.getAttribute && current.value.length==current.getAttribute("maxlength")) { to.focus() } } </script>
Bu yeterli olmayacaktır. Şimdi aşağıdaki şekilde textboxların onKeyup özelliğini ekleyelim.
<b>Kredi Kartı Numaranızı Giriniz? Örnek(1234-5678-9012-3456):</b> <form name="kart"> <input type="text" name="kart1" size=4 maxlength=4 onKeyup="autotab(this, document.kart.kart2)"> <input type="text" name="kart2" size=4 maxlength=4 onKeyup="autotab(this, document.kart.kart3)" > <input type="text" name="kart3" size=4 maxlength=4 onKeyup="autotab(this, document.kart.kart4)"> <input type="text" name="kart4" size=4 maxlength=4> </form>
Şimdi istediğimizi yaptık. Kolaylıklar!
Yorumlar