You can prevent an HTML element from receiving focus when navigating through a webpage using the TAB key on the keyboard by setting the tabindex
attribute on the element to -1
.
For example:
<button>Button 1</button> <button tabindex="-1">Button 2 (skipped)</button> <button>Button 3</button>
In the example above, "Button 2" will be skipped when the user navigates through the buttons using the TAB
key (as it is removed from the normal tab order).
Skipping an element using tabindex="-1"
doesn't mean it is entirely inaccessible to keyboard-only users, as they can still access the element using other keyboard navigation techniques (such as, using the arrow keys to navigate between elements, using access keys to jump directly to specific elements, etc.).
Hope you found this post useful. It was published . Please show your love and support by sharing this post.