灯箱关闭事件处理

Question

我在页面上有一个简单的灯箱，其中关闭图标有一些 class .closeIt。当用户单击关闭图标时，我想将焦点移回触发灯箱的 link 元素。

我尝试添加一些函数来输入触发 link 和关闭图标 class 名称。

 function focusBack(triggeringLinkId,closingLinkClass){
     $(closingLinkClass).click(function () {
        $(triggeringLinkId).focus();
     });
  }

并且对于每个灯箱，我都手动调用函数，如下所示：

 focusBack('#someLink','.closeIt')

如果我在页面上只有一个灯箱，这种方法工作正常，但如果我有多个灯箱，它开始将它绑定到最后调用的函数，现在无论我关闭什么灯箱，焦点都会回到我上次调用 focusBack 函数的触发 link。

处理这种情况的最佳方法是什么？

Answer 1

我已使用此解决方法解决了问题：

function focusBack(triggeringLinkId,closingLinkClass){
$(triggeringLinkId).click(e){
   $(e.target).addClass('triggeringLinkClass');
}
 $(closingLinkClass).click(function () {
    $(triggeringLinkClass).focus();
    $(triggeringLinkClass).removeClass('triggeringLinkClass');
 });
}

我认为这不是最好的方法，但它解决了我的问题。

灯箱关闭事件处理

Lightbox close event handling

html

javascript

jquery

jquery-events