HTML | DOM onfocusin 事件

HTML DOM onfocusin 事件在元素获得焦点时发生。 onfocusin 与 onfocus 相同，唯一的区别是 onfocus 事件不会冒泡。

如果你想知道是一个元素还是它的子元素获得焦点，你应该使用 onfocusin 事件。
onfocusin 事件与 onfocusout 事件相反。

注意： Firefox 不支持 onfocusin 事件，但是在捕获侦听器的帮助下，您可以找出元素的子元素是否获得焦点。

句法：

在 HTML 中：

在 JavaScript 中（在 Chrome、Safari 和 Opera 15+ 中可能无法正常工作）：

object.onfocusin = function(){myScript};

在 JavaScript 中，使用 addEventListener() 方法：

object.addEventListener("focusin", myScript);

示例：使用 HTML

  

    
        GeeksforGeeks
        HTML DOM onfocusin Event Focus:
        
  
        
            function GFGfun(foc) {
                foc.style.background = "yellow";
            }
        
    

  
                

输出：

示例：使用 JavaScript

  

    
        GeeksforGeeks
        HTML DOM onfocusin Event Focus:
        
        
            document.getElementById(
              "fname").onfocusin = function() {
                myFunction()
            };
  
            function myFunction() {
                document.getElementById(
                  "fname").style.backgroundColor = "yellow";
            }
        
    

  

输出：

示例：使用 addEventListener() 方法：

  

    
        GeeksforGeeks
        HTML DOM onfocusin Event Focus:
        
  
        
            document.getElementById(
              "fname").addEventListener("focusin", gfgFun);
  
            function gfgFun() {
                document.getElementById(
                  "fname").style.backgroundColor = "yellow";
            }
        
    

  

输出：

支持的浏览器： HTML DOM onfocusin 事件支持的浏览器如下：

• 谷歌浏览器
• IE浏览器
• 火狐 52
• 苹果Safari
• 歌剧