jQuery ( ": focus")

설명 : 현재 포커스가있는 경우 요소를 선택합니다.

다른 의사 클래스 선택기 ( ":"로 시작하는 선택기) :focus와 마찬가지로 태그 이름이나 다른 선택기를 사용하는 것이 좋습니다 . 그렇지 않으면 범용 선택기 ( "*")가 내포됩니다. 다른 말로하면, 벌거숭이 $( ":focus" )는에 해당합니다 $( "*:focus" ). 현재 포커스 된 요소 $( document.activeElement )를 찾고있는 경우 전체 DOM 트리를 검색하지 않고도 검색합니다.

예:

포커스가있는 요소에 초점을 맞춘 클래스를 추가합니다.

<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>focus demo</title>

  <style>

  .focused {

    background: #abcdef;

  }

  </style>

  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>

</head>

<body>

<div id="content">

  <input tabIndex="1">

  <input tabIndex="2">

  <select tabIndex="3">

    <option>select menu</option>

  </select>

  <div tabIndex="4">

    a div

  </div>

</div>

<script>

$( "#content" ).delegate( "*", "focus blur", function() {

  var elem = $( this );

  setTimeout(function() {

    elem.toggleClass( "focused", elem.is( ":focus" ) );

  }, 0 );

});

</script>

</body>

</html>