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

Question

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

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

Answer 1

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

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

Answer 2

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

当你失去焦点时触发某些东西。

您还可以在元素上创建一个 tabindex tabindex="0" 以确定标签的顺序。

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