jQuery focusout() 方法

  • 定义和用法

    当元素(或在其内的任意元素)失去焦点时发生 focusout 事件。
    focusout() 方法会附加一个函数,以在元素或其内部任何元素失去焦点事件时运行。
    blur() 方法不同的是,focusout() 方法在任意子元素失去焦点时也会触发。
    提示:该方法通常与 focusin() 方法一起使用。
  • 语法

    $(selector).focusout(function)
  • 参数

    参数 描述
    function 可选。规定 focusout 事件发生时要运行的函数。
  • 示例

    下例演示了当 <div> 元素或其任意子元素获得焦点时,设置 <div> 元素的背景颜色:
    <!DOCTYPE html>
    <html lang="en">
    <head>
       <meta charset="UTF-8">
       <title>欢迎来到菜鸟教程</title>
       //此版本是百度cdn 1.11.1,当然你可以使用更高的版本,从2.0版本以上的是不支持ie6-8的
       <script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
          <script>
              $(document).ready(function () {
                 $("div").focusin(function(){
                     $(this).css("background-color","#f0f");
                 });
                 $("div").focusout(function(){
                     $(this).css("background-color","#fff");
                 });
               });
          </script>
    </head>
    <body>
        <div style="border: 1px solid black;padding:10px;">
              First name: <input type="text"><br>
              Last name: <input type="text">
        </div>
        <p>点击输入框获取焦点,点击输入框外的部分失去焦点。</p>
    </body>
    </html>
    
    尝试一下