Question

我正在尝试打开导航栏菜单，悬停和焦点。这是我试过的：但是在悬停时它工作正常，但在焦点上菜单列表应该打开。

由于屏幕阅读器使用键盘标签按钮，我需要打开菜单列表，就像在悬停时打开一样。

JS：

$(document).ready(function(){
    $(".dropdown").hover(            
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideDown("fast");
            $(this).toggleClass('open');        
        },
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideUp("fast");
            $(this).toggleClass('open');       
        }
    ).focus(function() {
            $('.dropdown-menu', this).stop( true, true ).slideDown("fast");
            $(this).toggleClass('open');        
        },
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideUp("fast");
            $(this).toggleClass('open');       
        }
    )
});

小提琴链接： Demo

Answer 1

test.dt <- datatable(test.df, colnames=c("aa", "cc")) %>% formatPercentage('a', 0) %>% formatCurrency('c', '$')不会像jQuery.focus那样使用2个处理程序。它只需要1个处理函数。此外，焦点事件在浏览器中适用于表单和锚元素。您正尝试在列表项上使用它。它可能无法一致地工作。

但是，如果您向元素添加hover属性，则焦点事件将适用于大多数最新浏览器。

以下是一个例子：

tabindex

$('.dropdown').focus(function(){
  alert('Focus event works!');
});

如何在悬停和焦点上打开引导导航菜单

1 个答案: