Javascript onfocus kullanımı

Sezai AlkanFrontend Developer

JavaScript #javascript #js #onfocus #onblur

Javascript onfocus kullanımında bir form elemanına focus, tıklanma durumunda çalışmaktadır.

Kullanımı : onfocus=""

onfocus kullanımı ile bir form elemanına tıklanma durumunda arkaplanını değiştirebilir veya kullanıcı üzerinde kontroller sağlayabilirsiniz.

<input type="text" onfocus="simple(this)">

function simple(e){
	e.style.background = "orange";
}

Yukarıdaki örnekte oluşturulan input a tıklanma durumunda nesnenin arka planı turuncu olarak değişecektir. onfocus özelliğini ise hangi durumunda çalıştığını böylelikle daha iyi anlayabilmekteyiz.

Ek olarak form elemanı üzerinden farklı bir yere tıklanması durumunda rengin tekrar eski haline gelmesini istiyor isek onblur özelliği kullanabilmekteyiz.

<input type="text" onfocus="simple(this)" onblur="simpleTwo(this)">

function simple(e){
	e.style.background = "orange";
}

function simpleTwo(e){
	e.style.background = "white";
}

Yukarıdaki örnekte form elemanına tıklama durumunda arkaplanı turuncu olacaktır. form elemanı dışında farklı bir yere tıklanmasında arka plan tekrar beyaz olacaktır.