當元素獲得焦點時,將發生HTML DOM onfocusin事件。 onfocusin與onfocus相同,唯一的區別是onfocus事件不會冒泡。
如果要確定某個元素或其子元素是否獲得焦點,則應使用onfocusin事件。
onfocusin事件與onfocusout事件相反。
注意:Firefox不支持onfocusin事件,但是在捕獲偵聽器的幫助下,您可以確定元素的子級是否獲得焦點。
用法:
在HTML中:
<element onfocusin="myScript">
在JavaScript中(可能無法在Chrome,Safari和Opera 15+中正常運行):
object.onfocusin = function(){myScript};
在JavaScript中,使用addEventListener()方法:
object.addEventListener("focusin", myScript);
例:使用HTML
<!DOCTYPE html>
<html>
<body>
<center>
<h1 style="color:green">GeeksforGeeks</h1>
<h2>HTML DOM onfocusin Event</h2> Focus:
<input type="text" onfocusin="GFGfun(this)">
<script>
function GFGfun(foc) {
foc.style.background = "yellow";
}
</script>
</center>
</body>
</html>
輸出:
例:使用JavaScript
<!DOCTYPE html>
<html>
<body>
<center>
<h1 style="color:green">GeeksforGeeks</h1>
<h2>HTML DOM onfocusin Event</h2> Focus:
<input type="text" id="fname">
<script>
document.getElementById(
"fname").onfocusin = function() {
myFunction()
};
function myFunction() {
document.getElementById(
"fname").style.backgroundColor = "yellow";
}
</script>
</center>
</body>
</html>
輸出:
例:使用addEventListener()方法:
<!DOCTYPE html>
<html>
<body>
<center>
<h1 style="color:green">GeeksforGeeks</h1>
<h2>HTML DOM onfocusin Event</h2> Focus:
<input type="text" id="fname">
<script>
document.getElementById(
"fname").addEventListener("focusin", gfgFun);
function gfgFun() {
document.getElementById(
"fname").style.backgroundColor = "yellow";
}
</script>
</center>
</body>
</html>
輸出:
支持的瀏覽器:下麵列出了HTML DOM onfocusin Event支持的瀏覽器:
- 穀歌瀏覽器
- IE瀏覽器
- 火狐52
- 蘋果Safari
- Opera
相關用法
- HTML onbeforeunload事件用法及代碼示例
- HTML onbeforeprint事件用法及代碼示例
- HTML onblur事件用法及代碼示例
- HTML oncanplay事件用法及代碼示例
- HTML onerror事件用法及代碼示例
- HTML fullscreenchange事件用法及代碼示例
- HTML onfocusout事件用法及代碼示例
- HTML onseeking事件用法及代碼示例
- HTML oncopy事件用法及代碼示例
- HTML onresize事件用法及代碼示例
- HTML onreset事件用法及代碼示例
- HTML onscroll事件用法及代碼示例
- HTML onratechange事件用法及代碼示例
- HTML onclick事件用法及代碼示例
- HTML oncontextmenu事件用法及代碼示例
注:本文由純淨天空篩選整理自Vijay Sirra大神的英文原創作品 HTML | DOM onfocusin Event。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。