【JavaScript】focus が効かない時にチェックしたいこと
239, 2019-11-10
目次
focus が効かない？
JavaScript で特定の要素にフォーカスを移したい時がある。
その場合、$('.myclass').focus() などのようにすればフォーカスを移せるが、これが効かない時がある。
div などの要素にフォーカスを移したい時は div に tabindex を設定する必要がある。
だから HTML は↓のような感じになる。
:::html
<div class="myclass" tabindex="0">
</div>
この .myclass にフォーカスを移したい場合は↓のように focus メソッドを使う。
:::javascript
$('.myclass').focus()
ちなみにこの方法だと div にフォーカス時のアウトラインが表示されてしまうので、これを消したい場合は↓のように CSS を書く。
:::css
.myclass:focus {
outline: none;
}