Question

我正在使用Venobox modal并需要ADA支持。我已经调整了一些东西以使其运行良好，但我还需要一件。我需要专注于返回按下关闭按钮时打开模态的元素a.venobox。

换句话说，如果用户只是通过网站进行制表，打开模式，然后将其关闭，然后再次选中，它会在他们离开的地方继续。

我尝试插入tabindex但它只适用于第一个标签，然后跳回页面顶部。然后，我尝试添加一些东西来保持焦点然后在关闭时返回它，但我不是最好用js。

由于

我当前的代码：

$(document).ready(function(){
  $('.venobox').venobox().click(function() {    
    $('.vbox-close').attr('tabindex', '1').attr('title','Close Modal');

    var focusReturn = $(this).focus();    
    $(".vbox-close").click(function(){
      return focusReturn;
    });

  });
});

Answer 1

设置var focusReturn = $(this).focus();只会将自定义变量设置为焦点函数(which is the element it was called on)的返回值。此外，the return value in an event handler is only used to prevent default event propagation.

您可能要做的是var focusReturn = $(this).focus;，然后在点击处理程序中使用focusReturn();进行调用。但是，我建议不要这样做，因为它是解决非功能性问题的功能方法。并且在非函数语言（例如javascript）中功能性写入很难阅读。

但是，有一种更常见（更常识）的方法：

// don't need this line // var focusReturn = $(this).focus();    
$(".vbox-close").click($.proxy(function() {
  $(this).focus();
}, this));

jQuery's proxy function用于更改函数执行的闭包上下文。

（可能）另一种改进方法是将该事件处理程序放在close上的.vbox-close事件上，但我对这个插件不太熟悉，不知道它支持哪些事件。这当然值得研究，因为对话框c（sh）可能会以多种方式关闭，而不仅仅是点击关闭按钮。

Answer 2

我最终不得不使用setTimeout来捕获焦点，而不是在卸载模态时重置它。对于任何可能需要这个的人来说，就是这样。

$(document).ready(function(){
    $('.venobox').venobox().click(function() {

        focusclick = this;

        $('.vbox-close').click(function() {    
            setTimeout("focusclick.focus()",500);
        });   

    });    
});

模态关闭后返回焦点

2 个答案: