javascript焦点事件是什么-前端问答-PHP中文网

javascript焦点事件是什么

首页

web前端

前端问答

javascript焦点事件是什么

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jan 28, 2022 pm 03:06 PM

html javascript 前端

焦点事件：1、利用focus()方法设置元素获取焦点事件，语法为“$(selector).focus(function)”；2、利用blur()方法设置元素失去焦点事件，语法为“$(selector).blur(function)”。

javascript焦点事件是什么

本教程操作环境：windows10系统、javascript1.8.5版、Dell G3电脑。

javascript焦点事件是什么

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

当通过鼠标点击选中元素或通过 tab 键定位到元素时，该元素就会获得焦点。

focus() 方法触发 focus 事件，或规定当发生 focus 事件时运行的函数。

语法为：

$(selector).focus()

登录后复制

或者：

$(selector).focus(function)

登录后复制

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

blur() 方法触发 blur 事件，或规定当发生 blur 事件时运行的函数。

语法为：

$(selector).blur()

登录后复制

或者：

$(selector).blur(function)

登录后复制

示例如下：

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("input").focus(function(){
    $("input").css("background-color","#FFFFCC");
  });
  $("input").blur(function(){
    $("input").css("background-color","#D6D6FF");
  });
});
</script>
</head>
<body>
Enter your name: <input type="text" />
<p>请在上面的输入域中点击，使其获得焦点，然后在输入域外面点击，使其失去焦点。</p>
</body>
</html>

登录后复制

输出结果：

+2.gif