bɪˈɡɪnə
bɪˈɡɪnə

Reputation: 1085

Why this code does not work to focus on desired div?

The code below should focus on the second div but it does not work what is wrong in this code?

$(function(){
    $("#two").focus();
});
body{color:white;}
#fis{height:600px;width: 60px;background-color:red;}
#two{height:600px;width: 60px;background-color:green;}
#thr{height:600px;width: 60px;background-color:blue;}
<div id="fis">hello
</div>
<div id='two'>mr
</div>
<div id='thr'>john
</div

Upvotes: 2

Views: 39

Answers (1)

ketan
ketan

Reputation: 19341

You should use tabindex for that.

<div id='two' tabindex='1'>mr
</div>

Check updated snippet;

$(function(){
    $("#two").focus();
});
body{color:white;}
#fis{height:600px;width: 60px;background-color:red;}
#two{height:600px;width: 60px;background-color:green;}
#thr{height:600px;width: 60px;background-color:blue;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="fis">hello
</div>
<div id='two' tabindex='1'>mr
</div>
<div id='thr'>john
</div>

Working Fiddle

Upvotes: 3

Related Questions