当输入有条件渲染时,在输入元素上使用 autoFocus 属性是否不好?

发布于 2025-01-20 23:09:43 字数 460 浏览 4 评论 0 原文

说,自动关注元素可能会引起视力和无视线用户的可用性问题。

我将输入元素作为模态(即有条件地渲染)渲染,并且作为模态渲染,我希望将重点放在输入元素上。 另一种方法是使用 useref 挂钩进行相同的操作,但是我认为自动道具和USEREF对A11Y都有相同的影响(我不确定,因此我不确定)。

一旦渲染输入,自动对焦是一种简单的聚焦方法,当显示模式时,我认为这是A11Y的最佳方法。当在初始页面加载本身中完成自动对焦时,该错误可能适用。

this eslint says Autofocusing elements can cause usability issues for sighted and non-sighted users, alike.

I am rendering the input element as a modal(i.e conditionally rendered) and as the modal is rendered I want the focus on input element.
The other approach is to do the same using useRef hook, But the point both autoFous prop and useRef have the same impact on a11y in my opinion(I am not sure hence asking).

The autoFocus is a easy way to focus as soon as the input is rendered and that's what I feel is best in terms of a11y when a modal is shown. The error might be applicable when autoFocus is done in the initial page load itself.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

半步萧音过轻尘 2025-01-27 23:09:43

我对 autocous 属性的理解是,它主要是在第一次加载页面时使用的。我已经阅读的可访问性问题(例如, autocus 属性上)是关于 autofocus 当他们通常使用屏幕读取器从顶部读取页面时,将用户倾倒在页面中间底部,可以分散可访问性。

在我看来,这不适用于模态,因为模态旨在吸引用户注意它。实际上, w3c wai-aria创作模态< /a> dialog states that focus should be placed on the first focusable element (eg, the input, the first paragraph, the OK button, etc.)

So, that's all to say, I think you should be fine from an accessibility standpoint to在模态首次加载时,使用 autocus 在模态中的&lt; input&gt; 元素上使用。

My understanding of the autofocus attribute is that it's primarily used when a page first loads. The accessibility concerns I've read (e.g., Bruce Lawson's article on the autofocus attribute) are about autofocus dumping a user in the middle of a page when they'd normally use a screen reader to read a page from top to bottom, which can be distruptive for accessibility.

In my view, that doesn't apply to a modal, because a modal is designed to draw the user's attention to it. In fact, the W3C WAI-ARIA Authoring Example of a modal dialog states that focus should be placed on the first focusable element (e.g., the input, the first paragraph, the OK button, etc.)

So, that's all to say, I think you should be fine from an accessibility standpoint to use autofocus on the <input> element in the modal when it first loads.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文