En son web geliştirme öğreticiler
 

onfocus Olay

<Olay Nesne

Örnek

Bir giriş alanının odağı aldığında bir JavaScript yürütün:

<input type="text" onfocus="myFunction()">
Kendin dene "

Daha "Try it Yourself" Aşağıdaki örnekler.

Tanımı ve Kullanımı

Bir öğe odak aldığında onfocus olayı oluşur.

Onfocus olay çoğunlukla <giriş>, <select> ve birlikte kullanılır <a> .

Tip: onfocus olay tersidir Onblur olay.

İpucu: onfocus olay benzer onfocusin olay. Temel fark onfocus etkinlik balonunu değil yapmasıdır. Eğer bir eleman veya alt odağı alır olmadığını öğrenmek istiyorsanız nedenle, onfocusin olayını kullanabilirsiniz. Ancak, isteğe bağlı olarak useCapture parametresini kullanarak elde edilebilir addEventListener() onfocus etkinlik için bir yöntem.

Tarayıcı Desteği

Olay
onfocus Evet Evet Evet Evet Evet

Sözdizimi

HTML'de:

< Kendin dene "

JavaScript:

object .onfocus=function(){ Kendin dene "

JavaScript olarak, kullanılarak addEventListener() metodu:

object .addEventListener("focus", myScript );
Kendin dene "

Not: addEventListener() metodu Internet Explorer 8 ve önceki sürümlerinde desteklenmez.

Teknik detaylar

Kabarcıklar: Yok hayır
iptal Edilebilir: Yok hayır
Etkinlik tipi: FocusEvent
Desteklenen HTML etiketleri: <Baz>, <BDO>, <br>, <head>, <html>, <iframe>, <meta>, <param> <script> <style> ve: DIŞINDA TÜM HTML öğeleri <title>
DOM Versiyon: Seviye 2 Olaylar
Örnekler

Diğer Örnekler

Örnek

Kullanılması "onfocus" ile birlikte "onblur" olay:

<input type="text" onfocus="focusFunction()" onblur="blurFunction()">
Kendin dene "

Örnek

Olay heyeti: useCapture parametrenizi addEventListener() true:

<form id="myForm">
  <input type="text" id="myInput">
</form>

<script>
var x = document.getElementById("myForm");
x.addEventListener("focus", myFocusFunction, true );
x.addEventListener("blur", myBlurFunction, true );

function myFocusFunction() {
    document.getElementById("myInput").style.backgroundColor = "yellow";
}

function myBlurFunction() {
    document.getElementById("myInput").style.backgroundColor = "";
}
</script>
Kendin dene "

Örnek

Olay heyeti: (Firefox tarafından desteklenmez) focusIn olayı kullanarak:

<form id="myForm">
  <input type="text" id="myInput">
</form>

<script>
var x = document.getElementById("myForm");
x.addEventListener("focusin", myFocusFunction);
x.addEventListener("focusout", myBlurFunction);

function myFocusFunction() {
    document.getElementById("myInput").style.backgroundColor = "yellow";
}

function myBlurFunction() {
    document.getElementById("myInput").style.backgroundColor = "";
}
</script>
Kendin dene "
<Olay Nesne