标签索引不适用于某些元素

Question

我有一个表单，其中有数据选择器和 select2（自定义下拉列表以进行搜索）和许多输入，文本区域字段，当我按下 Tab 按钮移动下一个字段时它工作正常但是当下一个字段是日期时选择器或 select2 然后选项卡索引不起作用我想要通用解决方案和所有浏览器。目前我正在做静态解决方案，比如获取一个 div 的 ID，然后获取具有 1 个值的 Prop 选项卡索引。

$scope.focusFunctionZipV = function(Id){
    var div = '#' + Id;
    $(div).prop('tabindex', '1');
    $(div).select2('open');
    //zipV is a div having zip code with select2
    if(div == '#zipV'){
        $('.datepicker-simple').prop('tabindex', '0');  
    }
}

Answer 1

您应该获取 id select2 ID，然后在关闭事件时将焦点指向下一个字段。

$('#currentDiv').select2().on("select2:close", function (e) { 
    $('#nextDiv').focus()
});

对于日期选择器

$('#ID').datepicker({
    onSelect: function(dateText, inst) {
        $('#nextIDdiv').focus();
    }    
});

对于简单的输入字段选项卡工作正常。

标签索引不适用于某些元素

Tab index not working for some elements

html

css

tabindex