jquery 模式对话框中的 Tabindex

发布于 2024-12-06 04:06:04 字数 189 浏览 4 评论 0原文

我试图在使用 jquery 对话框显示的表单中的所有输入元素上设置选项卡索引。当前的行为是,当用户开始按 Tab 键(第一个元素设置为焦点,因此它是行中的第一个元素)时,他们可以按 Tab 键浏览所有控件。问题是他们可以继续使用 Tab 键切换到对话框后面的元素。

有没有一种方法可以防止这种情况发生,并且只能通过打开的对话框中的表单元素进行切换?

Im attempting to set the tab index on all the input elements in a form that is displayed with a jquery dialog. The current behavior is that when the user starts to tab (the first element is set to focus so that is the first in line) they can tab through the all the controls. The issue us that they can continue to tab to the elements behind the dialog.

Is there a way that I can prevent this from happening and ONLY tab through the form elements in the open dialog?

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

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

发布评论

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

评论(3

很酷又爱笑 2024-12-13 04:06:05

我给你逻辑。你可以相应地编写代码。

在表单的最后一个元素上添加一个事件处理程序来处理按键事件。

在处理函数内,如果键不是 TAB,则必须返回 true,否则返回 false。

这意味着只有非 TAB 键才能在该字段上工作。

您可以通过 google 搜索选项卡的 ascii 代码。你谷歌代码来处理关键事件。

谢谢

I'm giving you the logic. you can write code accordingly.

On the last element of your form add an event handler to handle key press event.

Inside the handler function you have to return true if key is not TAB otherwise return false.

That means only non-TAB keys will work on that field.

You can google ascii code of tab. you google code to handle key events.

Thank You

七度光 2024-12-13 04:06:05

计算你有多少个元素并设置它,以便如果你的 tabindex == numberOfTabs 它将重置为原始索引。

如果您需要在任何功能之外执行此操作,请使用隐藏输入执行此操作,

然后在 js 中进行选项卡事件访问并将 tabindexCurrent val() 更新为新的

count how many elements you have and set it so that if your tabindex == numberOfTabs that it will reset to the original index.

if you need to do this outside of any functionality etc do it with a hidden input

then in the js for the tab event access and update the tabindexCurrent val() to the new one

划一舟意中人 2024-12-13 04:06:05

是的,这个问题有一个解决方案。我面临着同样的问题。

要使其正常工作,您必须使用 jquery.ui.dialog.js ...将其包含在您的页面上。还要在 document.ready 中添加 jQuery 模式对话框代码。

Yes, there is a solution to this problem. I was facing the same problem.

To make it work you have to use jquery.ui.dialog.js … include it on your page. Also add your jQuery modal dialog code in document.ready.

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