:focus

Categories: Events > Form Events | Forms

:focus selector

version added: 1.6jQuery(':focus')

描述选择当前获取焦点的元素。

如同其他伪类选择器（那些以":"开始），建议:focus前面用标记名称或其他选择;否则，通用选择("*")是不言而喻的。换句话说，$(':focus')等同为$('*:focus')。如果你正在寻找当前的焦点元素，$( document.activeElement )将检索，而不必搜索整个DOM树。

Example:

Adds the focused class to whatever element has focus

<!DOCTYPE html>
  <html>
  <head>
  <style>
  .focused {
  background: #abcdef;
  }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  </head>
  <body>
  
  <input tabIndex="1">
  <input tabIndex="2">
  <select tabIndex="3">
  <option>select menu</option>
  </select>
  <div tabIndex="4">
  a div
  </div>
<script>
  $("*").live("focus blur", function(e) {
  var el = $(this);
  setTimeout(function() {
  el.toggleClass("focused", el.is(":focus"));
  }, 0);
  });
  </script>
</body>
  </html>

:focus

:focus selector

version added: 1.6jQuery(':focus')

Example:

Adds the focused class to whatever element has focus

Demo: