详说jQuery的focus()blur()事件

Posted 2020-09-21

• what

　　focus():当元素获得焦点时，发生 focus 事件。

　　blur():当元素失去焦点时发生 blur 事件。

• 小例子

　　html文件 
 Enter your name: <input type="text" />

javascript文件：
$(document).ready(function(){
      $("input").focus(function(){
        $("input").css("background-color","#ff0"); //黄色
      });
      $("input").blur(function(){
        $("input").css("background-color","#0f0"); //绿色
      });
    });

　　浏览器打开：

　　1.刷新页面，输入框为白色背景

　　

　　2.准备键入，输入框获得焦点，输入框背景变为黄色

　　

　　3.输入结束，失去焦点，输入框背景变为绿色