:focus【フォーカス要素】

メモ

  • フォーカスがある要素を選択
    • $( ":focus" ) よりも $( "input:focus" ) 等を推奨  ( "*:focus" とみなされる)
  • フォーカスがある要素は、$( document.activeElement ) で取得可 (DOM ツリー検索なし)

構文

jQuery( ":focus" ) 1.6

関連

<p id="id1">
  <input id="input1" value="input1">
  <input id="input2" value="input2">
  <input id="input3" value="input3">
  <span id="focus" style="border:2px blue solid; padding:0 10px;"></span>
</p>

<script>
$("#id1 input").focus( function() {
  $( "input:focus" ).css( "background-color", "pink" );
  $( "input:not(:focus)" ).css( "background-color", "white" );
  $( "#focus" ).html( "id = " + $( document.activeElement )[0].id );
})

$( "#input1" ).focus();
</script>