满足WCAG 2.1-SC 1.4.13对工具提示的不可受理要求。

问题描述 投票:0回答:1

我正在努力满足无障碍的问题 WCAG 2.1 - SC 1.4.13, 悬停或聚焦的内容。特别是关于可不予受理的部分,包括 Bootstrap 3.3工具提示. 它规定工具提示应该能够在触发器失去焦点或悬停的情况下轻松关闭。我想让用户使用escape键来关闭工具提示(如我所推荐的)。我已经能够通过javascript实现焦点部分的关闭(通过键盘点击到触发器并按下escape键)。但是当我尝试用悬停键(将鼠标放在触发器上并按escape键)来实现同样的功能时,工具提示并没有消失。你可以看上面链接页面的例子1,了解我想达到的目的。以前有人遇到过这种情况吗?先谢谢你

这是我使用的代码。

$(document).ready(function() {
    $('[data-toggle="tooltip"]').on('shown.bs.tooltip', function() {
        var me = this;
        console.log('shown');
        $(this).keyup(function(e) {
            console.log('key up');
            // Escape key
            if (e.key === 'Escape') {
                console.log('hide');
                $(me).tooltip('hide');
            }
        });
    });
});
javascript jquery tooltip wcag
1个回答
0
投票

这是我最终做了什么,它的工作原理 好的但想找些不那么黑的东西。

$(document).ready(function() {
    $('[data-toggle="tooltip"]').on('shown.bs.tooltip', function() {
        var me = this;
        $(document).one('keyup', function(e) {
            // Escape key
            if (e.key === 'Escape') {
                $(me).tooltip('hide');
            }
        });
    });
});
© www.soinside.com 2019 - 2024. All rights reserved.