JavaScript onFocus ve onBlur Olayı

JavaScript onFocus ve onBlur Olayı

JavaScript'te onFocus ve onBlur Olayı

onBlur, o an seçili ve aktif olan elemanın terkedilmesi ve seçilmiş özelliğini kaybetmesi olayıdır. Örneğin bir metin kutusuna tıklandığında onFocus olayı gerçekleşir. Yani o kutuya odaklanılmış olur ve kutu aktif hale gelir. Sayfadaki herhangi başka bir yere tıklanarak kutudan çıkıldığında ise o kutu için onBlur olayı gerçekleşmiş olur.

onBlur Olayına Örnek

Metin kutusu tıklanmadan önce:

Metin kutusuna tıklandığında (onFocus veya onClick kullanılabilir)

Bunun için onFocus ve onBlur olaylarında çalışacak iki fonksiyona ihtiyacımız var:

<html>
<head>
<script language="javascript">
function kutuGiris()
{
    if(document.form1.k1.value=="Ara...")
    {
        document.form1.k1.value="";
        }
}
        
function kutuCikis()
{
    if(document.form1.k1.value=="")
    {
        document.form1.k1.value="Ara...";
        }
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<input type="text" name="k1" id="k1" onFocus="kutuGiris()" value="Ara..." onblur="kutuCikis()"/>
<input type="submit" name="b1" id="b1" value="Ara" />
</form>
</body>
</html>

javascript onblur nedir ne işe yarar, onFocus nedir nasıl kullanılır, onFocus onblur örnekleri

KONU İLE İLGİLİ ÖRNEKLER

Metin kutusu içindeki yazının tıklanınca kaybolması Kendin Dene

Kendin Dene butonuna tıkla, kodları değiştir, sonucu gör...

onFocus olayında yani kutu aktif hale getirildiğinde, metin kutusu içerisindeki metin siliniyor.

onBlur olayında ise aynı metin tekrar kutuya yazılıyor.

Ancak her iki olayda da kullanıcının metni değiştirip değiştirmediği kontrol ediliyor.



YORUMLAR




4722  kez okundu.

Online Kullanıcı Sayısı 169