Solution 1 :

not sure if that is what you want, but you can make elements unfocusable.
See here for refference:

<div class="first">First</div>
<div class="second" tabIndex="-1">Secoond</div>
<div class="third">Third</div>

Note that an element with a negative tabindex is still focusable, it just cannot be reached using sequential focus navigation (i.e. tabbing)

Solution 2 :

from: How to disable all div content



.disabledbutton {
    pointer-events: none;
    opacity: 0.4;

Problem :

<div class="first">First</div>
<div class="second">Second</div>
<div class="third">Third</div>

I am navigating the html with arrow keys(up, down) focus was going to each div element. I want to skip the focus of one div element in the html page

I tried with the below code

$('.second').onKeyDown= {e => {
if(e.key == "ArrowUp" || e.key == "ArrowDown") {
return false:


Comment posted by stackminu

The question is not clear. Can you elaborate more or provide a JSFiddle?

Comment posted by shaik khaja

If we have tabindex=”-1″ On tabbing it will unfocusable but while navigating through the arrow keys it is focusable. I want it to unfocusable while navigating through arrow keys


Leave a Reply

Your email address will not be published. Required fields are marked *