jquery - 打开Fancybox-2后，在fancybox窗口中发送焦点

Question

为了便于访问，我尝试在 Fancybox 窗口打开后将焦点发送到它。

我在 Fancybox 的容器上将 tabindex 添加到 0，然后将焦点发送到它上面。这行不通。

afterLoad: function() {
    this.group[this.index].content.attr('tabindex','0');
    this.group[this.index].content.focus();
}

我使用 NVDA (NonVisual Desktop Access) http://www.nvaccess.org/进行测试，但 Chrome 也可以显示焦点。

谢谢你的帮助。

score 9 · Accepted Answer

它几乎取决于typeofcontent但这应该可以解决问题（使用inline，ajax或html内容）

$(".fancybox").fancybox({
    afterShow: function () {
        $(this.content).attr("tabindex",1).focus()
    }
});

它应该同样适用于单个或画廊元素。

请参阅JSFIDDLE（使用 Chrome 使其显而易见）

注意：我建议您使用tabindex>0来避免 IE 出现问题（如果您关心跨浏览器兼容性）

编辑：这里有一个不同类型内容的示例：JSFIDDLE在图像或iframefocus上不太明显

编辑2：更一般的东西会关注.fancybox-inner选择器，无论内容类型如何

$(".fancybox-inner").attr("tabindex",1).focus();

查看更新的 JSFIDDLE，但想知道这是否适合您的目的

1 回答 1