Rekomendasyon ng kurso:
onfocusout na kaganapan
Pagsasakop at paggamit
Bagaman ang Firefox ay hindi suporta ang onfocusout na kaganapan, maaari mong makita kung ang anumang elemento o anak ng elemento ay nawala ang fokus sa pamamagitan ng paggamit ng capture listener ng onblur na kaganapan (sa pamamagitan ng opsyonal na parameter na useCapture ng addEventListener() method). onfocusout na kaganapan ay nangyayari kapag ang elemento ay papunta sa pagkawala ng fokus. onblur Eventonfocusout na kaganapan ay katulad ng
Bagaman ang Firefox ay hindi suporta ang onfocusout na kaganapan, maaari mong makita kung ang anumang elemento o anak ng elemento ay nawala ang fokus sa pamamagitan ng paggamit ng capture listener ng onblur na kaganapan (sa pamamagitan ng opsyonal na parameter na useCapture ng addEventListener() method).. Ang pangunahing pagkakaiba sa pagitan ng onblur na kaganapan ay hindi ito namumulakad. Kaya, kung gusto mong makita kung ang elemento o ang kanyang anak ay nawala ang fokus, gamitin ang onfocusout na kaganapan.
Bagaman ang Firefox ay hindi suporta ang onfocusout na kaganapan, maaari mong makita kung ang anumang elemento o anak ng elemento ay nawala ang fokus sa pamamagitan ng paggamit ng capture listener ng onblur na kaganapan (sa pamamagitan ng opsyonal na parameter na useCapture ng addEventListener() method). Mga tagubilin: onfocusin Eventonfocusout na kaganapan at
Kabaligtaran.
Mga halimbawa
Halimbawa 1
Ipatupad ang JavaScript kapag ang input field ay papunta sa pagkawala ng fokus:
<input type="text" onfocusout="myFunction()">
Sa ibaba ng pahina mayroong mas maraming TIY na mga halimbawa.
Mga paraan ng pagsusuri
Sa HTML:< element.addEventListener("focusout",onfocusout="
">
Sa JavaScript, gamit ang addEventListener() method:Sa JavaScript (maaring hindi gumana ng ayon sa inaasahan sa Chrome, Safari at Opera 15+):.addEventListener("focusout",.onfocusout = function(){
};
Sa JavaScript, gamit ang addEventListener() method:object .addEventListener("focusout",myScript
注释：); Internet Explorer 8 o mas maaga ay hindi suportadoMga paraan ng pagdodughet sa addEventListener()
.
| Detalye ng teknolohiya: | 支持 |
|---|---|
| Mabilis na pagkalat: | Maaaring ikansela: |
| Hindi suportado: | FocusEvent |
| Suportadong HTML na tag: | Lahat ng HTML na elemento, maliban sa: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> at <title> |
| DOM 版本： | Level 2 Events |
浏览器支持
表中的数字注明了完全支持该事件的首个浏览器版本。
| 事件 | Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| onfocusout | 支持 | 支持 | 52.0 | 支持 | 支持 |
注释：onfocusout 事件在使用 JavaScript HTML DOM 语法的 Chrome、Safari 和 Opera 15+ 中可能无法按预期工作。但是，它应该作为 HTML 属性并使用 addEventListener() 方法（请参见下面的语法示例）。
更多实例
例子 2
将 "onfocusin" 与 "onfocusout" 事件一起使用：
<input type="text" onfocusin="focusFunction()" onfocusout="blurFunction()">
例子 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>
例子 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>
