嵌套在表单中的引导下拉菜单:输入时选项卡索引中断

Bootstrap dropdown menu nested in form: tabindex breaks on enter

本文关键字:输入 选项 中断 索引 下拉菜单 表单 嵌套      更新时间:2023-09-26

我有一个 Bootstrap 3 下拉菜单,它位于元素内部,位于两个文本输入字段之间。

下拉列表的 role="menu" 属性允许使用向上/向下箭头和 Enter 键进行导航。但是,当我在下拉列表中进行选择并点击"输入"时,表单的 tabindex 将重置回第一个输入,而不是按 Tab 键重置为下一个输入字段。

有没有办法专注于表单中的下一个字段,而无需通过 JS 或自定义 tabindex 顺序显式执行此操作?

您唯一的选择是更改引导程序.js如果您不想添加新的 JS 文件,请在此处包含 js 函数。Bootstrap是用CSS和HTML的组合完成的,行为由你定义。Bootstrap 不提供处理元素行为的方法。

这是处理上述行为所需的函数。我已经在本地测试了该功能,它也将处理输入按键操作。

$('.dropdown-menu li a').on('click', function(){    
document.getElementById("#myDivId").focus();

});

希望这有帮助!