如何禁用对特定 html 元素的关注？

Question

我在vue js有自定义输入组件，在这个组件中我有输入和两个按钮。当输入松散焦点时，我想专注于下一个输入，但现在它专注于那些按钮。 最后我应该按三下 tab 键来专注于下一个输入。

是否有任何 html 属性可以禁用对某些元素的关注？ 或者有一种javascript方式？

Answer 1

tabindex 属性控制制表符。 将其设置为 -1 并且 Tab 键不会在该元素上停止。

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

Answer 2

您可以使用 blur 事件，它相当于https://www.w3schools.com/jsref/event_onfocusout.asp <input v-on:blur="handleBlur">

当你失去焦点时触发某事。

您还可以在元素上创建 tabindex tabindex="0"来确定 Tab 的顺序。

不幸的是，除非您想禁用整个元素，否则您无法使元素不可聚焦。 因为那样你就无法在该输入中输入任何内容。