tutorial pengembangan web terbaru
 

Acara onfocusout

<Object Acara

Contoh

Mengeksekusi JavaScript ketika sebuah field input adalah tentang kehilangan fokus:

<input type="text" onfocusout="myFunction()">
Cobalah sendiri "

Lebih "Try it Yourself" contoh di bawah ini.

Definisi dan Penggunaan

Acara onfocusout terjadi ketika unsur adalah tentang kehilangan fokus.

Tip: Acara onfocusout mirip dengan onblur acara. Perbedaan utama adalah bahwa acara onblur tidak gelembung. Oleh karena itu, jika Anda ingin mengetahui apakah elemen atau anaknya kehilangan fokus, Anda harus menggunakan acara onfocusout.

Tip: Meskipun Firefox tidak mendukung acara onfocusout, Anda dapat mengetahui apakah seorang anak dari elemen kehilangan fokus atau tidak, dengan menggunakan pendengar menangkap untuk onblur acara (menggunakan useCapture parameter opsional dari addEventListener() metode).

Tip: Acara onfocusout adalah kebalikan dari onfocusin acara.

Dukungan Browser

Peristiwa
onfocusout iya nih iya nih Tidak didukung iya nih iya nih

Catatan: Acara onfocusout mungkin tidak bekerja seperti yang diharapkan di Chrome, Safari dan Opera 15 + menggunakan sintaks JavaScript HTML DOM. Namun, harus bekerja sebagai atribut HTML dan dengan menggunakan addEventListener() metode.

Sintaksis

Dalam HTML:

< Cobalah sendiri "

Dalam JavaScript (may not work as expected in Chrome, Safari and Opera 15+) :

object .onfocusout=function(){ Cobalah sendiri "

Dalam JavaScript, menggunakan addEventListener() metode:

object .addEventListener("focusout", myScript );
Cobalah sendiri "

Catatan: addEventListener() metode tidak didukung di Internet Explorer 8 dan versi sebelumnya.

Rincian teknis

Gelembung: iya nih
dibatalkan: Tidak
jenis acara: FocusEvent
tag HTML yang didukung: SEMUA elemen HTML, KECUALI: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, dan <title>
DOM Versi: Level 2 Acara
contoh

Contoh lebih

Contoh

Menggunakan "onfocusin" bersama-sama dengan "onfocusout" acara:

<input type="text" onfocusin="focusFunction()" onfocusout="blurFunction()">
Cobalah sendiri "

Contoh

Delegasi acara: pengaturan parameter useCapture dari addEventListener() ke benar (for focus and blur) :

<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>
Cobalah sendiri "

Contoh

Delegasi acara: menggunakan event focusin (tidak didukung oleh Firefox):

<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>
Cobalah sendiri "
<Object Acara