Peristiwa onfocusin

Peristiwa DOM Peristiwa FocusEvent

Definisi dan penggunaan

Peristiwa onfocusin terjadi saat elemen akan mendapatkan fokus.

Walaupun Firefox tidak mendukung peristiwa onfocusin, Anda dapat menentukan apakah elemen anak mendapatkan fokus melalui penggunaan penjaga pengambilan fokus peristiwa onfocus (gunakan parameter opsional useCapture methode addEventListener())Peristiwa onfocusin seperti: Peristiwa onfocusPerbezaan utama adalah peristiwa onfocus tidak menumpuk.

Walaupun Firefox tidak mendukung peristiwa onfocusin, Anda dapat menentukan apakah elemen anak mendapatkan fokus melalui penggunaan penjaga pengambilan fokus peristiwa onfocus (gunakan parameter opsional useCapture methode addEventListener()).

Walaupun Firefox tidak mendukung peristiwa onfocusin, Anda dapat menentukan apakah elemen anak mendapatkan fokus melalui penggunaan penjaga pengambilan fokus peristiwa onfocus (gunakan parameter opsional useCapture methode addEventListener())Petikan: Peristiwa onfocusoutPeristiwa onfocusin dengan:

Sebaliknya.

Instans

Contoh 1

Melaksanakan JavaScript saat bidang input akan mendapatkan fokus:

Cuba Sendiri

<input type="text" onfocusin="myFunction()">

Bawah halaman ini ada contoh TIY yang lebih banyak.

Sintaks

Pada HTML:< elemen.addEventListener("focusin",onfocusin="

Cuba Sendiri

">

Pada JavaScript, gunakan methode addEventListener():Pada JavaScript (dalam Chrome, Safari dan Opera 15+ mungkin tidak berfungsi dengan baik):.addEventListener("focusin",.onfocusin = function(){

Cuba Sendiri

};

Pada JavaScript, gunakan methode addEventListener():objek .addEventListener("focusin",myScript

Cuba Sendiri

注释：); Internet Explorer 8 atau versi yang lebih awal tidak mendukungMethode addEventListener()

.

Rangkaian teknikal: 支持
Tumpukan: Boleh dicabut:
Tidak didukung: Peristiwa FocusEvent
Tanda buku HTML yang didukung: Semua elemen HTML, kecuali: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> serta <title>
DOM 版本： Level 2 Events

浏览器支持

表中的数字注明了完全支持该事件的首个浏览器版本。

事件 Chrome IE Firefox Safari Opera
onfocusin 支持 支持 52.0 支持 支持

注释：onfocusin 事件在使用 JavaScript HTML DOM 语法的 Chrome、Safari 和 Opera 15+ 中可能无法按预期工作。但是，它应该作为 HTML 属性并使用 addEventListener() 方法（请参见下面的语法示例）。

更多实例

例子 2

将 "onfocusin" 与 "onfocusout" 事件一起使用：

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

Cuba Sendiri

例子 3

事件委托：将 addEventListener() 的 useCapture 参数设置为 true（用于 focus 和 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>

Cuba Sendiri

例子 4

事件委托：使用 focusin 事件：

<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>

Cuba Sendiri

Peristiwa DOM Peristiwa FocusEvent