Latest web development tutorials

acara onfocusout

Acara Referensi Obyek benda acara

contoh

Mengeksekusi JavaScript ketika input mendatang kotak input kehilangan fokus:

<Input type = "text" onfocusout = "myFunction ()">

Coba »

Bagian bawah berisi lebih kasus.


Definisi dan Penggunaan

onfocusout acara mendatang dipicu ketika elemen kehilangan fokus.

Tip: onfocusout peristiwa mirip dengan onblur acara. Perbedaan utama adalah bahwa acara onblur tidak mendukung menggelegak. Jadi, jika Anda perlu untuk melihat apakah unsur atau sub-elemen mendapat fokus, Anda perlu menggunakan onfocusout acara.

Tip: Meskipun Firefox tidak mendukung onfocusout peristiwa, tetapi Anda dapat menggunakan onfocus yang (menggunakan metode addEventListener () merupakan parameter opsional useCapture) peristiwa capture Monitor untuk melihat apakah unsur atau sub-elemen kehilangan fokus.

Tip: Sebaliknya acara onfocusout event adalah onfocusin acara.


Dukungan Browser

peristiwa
onfocusout ya ya Tidak mendukung ya ya

Catatan: Gunakan sintaks HTML DOM di Chrome, Safari dan Opera 15+ browser onfocusin peristiwa mungkin tidak bekerja dengan benar. Namun, ia sebagai elemen HTML dengan menggunakan metode addEventListener () dapat bekerja.


tatabahasa

Di HTML:

<Elementonfocusout = "myScript"> coba

JavaScript (Chrome, Safari dan Opera 15+ mungkin tidak bekerja dengan benar) di:

objek .onfocusout = function () {myScript }; mencoba

JavaScript, menggunakan () metode addEventListener:

objek .addEventListener ( "focusout", myScript ); mencoba

Catatan: Internet Explorer 8 dan versi sebelumnya dari IE tidak mendukung () addEventListener metode.


rincian teknis

Apakah akan mendukung gelembung: ya
Hal ini dapat dibatalkan: tidak
Jenis acara: FocusEvent
tag HTML didukung: Semua elemen HTML kecuali: <base>, <bdo>, Situs, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, dan <title>


contoh

contoh yang lebih

contoh

Gunakan "onfocusin" dan "onfocusout" acara:

<Input type = "text" onfocusin = "focusFunction ()" onfocusout = "blurFunction ()">

Coba »

contoh

delegasi acara: Set addEventListener () Parameter useCapture benar (untuk fokus dan mendapatkan kehilangan fokus):

<Form id = "myForm">
<Input type = "text" id = "myInput">
</ Form>

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

Fungsi myFocusFunction () {
. Document.getElementById ( "myInput") style.backgroundColor = "kuning";
}

Fungsi myBlurFunction () {
document.getElementById ( "myInput") style.backgroundColor = "".;
}
</ Script>

Coba »

contoh

delegasi acara: Gunakan focusout acara (browser Firefox tidak mendukung):

<Form id = "myForm">
<Input type = "text" id = "myInput">
</ Form>

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

Fungsi myFocusFunction () {
. Document.getElementById ( "myInput") style.backgroundColor = "kuning";
}

Fungsi myBlurFunction () {
document.getElementById ( "myInput") style.backgroundColor = "".;
}
</ Script>

Coba »


Acara Referensi Obyek benda acara