jQuery 失去焦点事件

失去焦点事件主要通过 focusout() 和 blur() 方法发生。当方法被触发时，它们都会失去焦点。这些事件彼此略有不同，但都服务于失去焦点的主要目的。
Focusout() 常与focusin() 结合使用，而blur() 常与focus() 结合使用。

请注意，当子元素失去焦点时，也会触发 focusout() 方法。

句法：

$(selector).focusout(function)

或者

$(selector).blur(function)

这里， 函数是参数，它是可选的，在 focusout() 和 blur() 方法被触发时发生。

示例 1：此示例显示了使用 focusout() 来失去焦点。

  

    
    
      
    
        $(document).ready(function () {
            $("div").focusin(function () {
                $(this).css("background-color", "#008000");
            });
            $("div").focusout(function () {
                $(this).css("background-color", "#FFFFFF");
            });
        });
    

  

    
        GeeksforGeeks
    
  
    
        Course: 
    
  
    
        Clicking outside the input text field enables 
        triggering of focusout event.
    

  

输出：

• 正常输出：
  
• 在输入文本字段内单击时：
  
• 在文本字段外单击时，它会恢复正常：
  

示例 2：此示例显示了使用 blur() 失去焦点。

  

    
    
      
    
        $(document).ready(function () {
            $("input").blur(function () {
                alert("Losefocus event occurs");
            });
        });
    

  

    
        GeeksforGeeks
    
      
    
        Course: 
  
    
      
    
        Clicking outside the input text field 
        enables triggering of blur event.
    

  

输出：
正常输出

• 
• 在输入文本字段内单击时
  
• 在文本字段外单击时，它会显示此弹出窗口