En son web geliştirme öğreticiler
 

onBlur olayı

<Olay Nesne

Örnek

Bir kullanıcı bir giriş alanı ayrılması durumunda JavaScript yürütün:

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

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


Tanımı ve Kullanımı

Bir nesne odağı kaybettiğinde Onblur olayı oluşur.

Onblur etkinlik çoğu zaman bir şekilde doğrulama kodu ile kullanılır (örneğin, kullanıcı bir form alanı ayrıldığında).

Tip: Onblur olay tersidir onfocus olay.

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


Tarayıcı Desteği

Olay
onblur Evet Evet Evet Evet Evet

Sözdizimi

HTML'de:

JavaScript:

object .onblur=function(){ Kendin dene "

JavaScript olarak, kullanılarak addEventListener() metodu:

object .addEventListener("blur", 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ı "onblur" ile birlikte "onfocus" 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