Menu
As question really. I have an input box on my page that I would like to ignore when navigating using the keyboard tab key.
I'm using this input box as a simple bot honeytrap and positioning it off the page, so at the moment when using the tab key, it looks to the user as though nothing has focus when they tab to this element.
376
Just add data-skip-on-tab="true" to the elements (or containers) you want to skip. You can still click to focus them or go back using shift - tab .
tabindex is a global attribute that allows an HTML element to receive focus. It needs a value of zero or a negative number in order to work in an accessible way. When tabindex 's value is set to zero or a positive number, the element can be navigated to via the keyboard's Tab key.
The tabindex attribute specifies the tab order of an element (when the "tab" button is used for navigating). The tabindex attribute can be used on any HTML element (it will validate on any HTML element. However, it is not necessarily useful).
To prevent tab indexing on specific elements, you can use tabindex="-1". If the value is negative, the user agent will set the tabindex focus flag of the element, but the element should not be reachable with sequential focus navigation. Note that this is an HTML5 feature and may not work with old browsers.
You can set the tabindex="-1" on this element so it's ignored in the tab order. 0 tells the browser to figure out the tab order on it's own, -1 tells the browser to ignore it.
118
You can use tabindex attribute to define order in which the tab key should cycle through elements. If you set tabindex="-1" the element will be skipped.
More info is available here http://www.webcheatsheet.com/HTML/controll_tab_order.php for example.
UPDATE changed tabindex="0" to "-1" based on comments
13
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
