I have custom input ponent in vue js, and in this ponent i have input and two buttons.when input loose focus, i want to focus on next input, but now it focus on those buttons. finally i should press tab key three times to focus on next input.

Is there any html attribute for disabling focus on some elements? or there is a javascript way?

I have custom input ponent in vue js, and in this ponent i have input and two buttons.when input loose focus, i want to focus on next input, but now it focus on those buttons. finally i should press tab key three times to focus on next input.

Is there any html attribute for disabling focus on some elements? or there is a javascript way?

• javascript
• html
• vue.js
• focus

• pointer-events: none; disables click – bansi Commented Mar 2, 2020 at 8:29
• Does this answer your question? Which HTML elements can receive focus? – Dima Tisnek Commented Mar 2, 2020 at 10:11
• Add tabIndex either static or programmatically stackoverflow./questions/3772438/… – Rajat Jaiswal Commented Mar 2, 2020 at 11:04

2 Answers 2

The tabindex attribute controls tabbing. Set it to -1 and the tab key will not stop on that element.

<button tabindex="-1">click me</button>

You could use the blur event which is an equivalent of https://www.w3schools./jsref/event_onfocusout.asp <input v-on:blur="handleBlur">

To trigger something when you lose focus.

You also could create a tabindex tabindex="0" on elements to determine the order of tabbing.

Unfortunately you can't make an element non focus-able unless you want to disable the whole element. Because then you couldn't type anything into that input.