在NanoGallery2的API中如何使用事件

Question

我正试图在我的web应用程序中使用NanoGallery2，它几乎是非常棒的，但是API中的几个明显的遗漏(例如处理图像信息的显示)和特性文档让我抓狂。

无论如何，API文档列出了许多可用的事件和回调。我毫不费力地使用回调来触发我自己的功能。

$("#nanogallery2").nanogallery2({
  items: images,
  fnImgDisplayed: onImageDisplayed,
  "lightboxNextImage.nanogallery2": onImageDisplayed,
  thumbnailHoverEffect2: "scale120|labelSlideUp|toolsAppear", 
});

function onImageDisplayed() {
  alert("Image Displayed");
}

然而，对于我的一生，我无法弄清楚如何在任何事件触发时触发我自己的功能。我很肯定我做错了，但没有变化，我试过了。我对lightboxNextImage和lightboxPreviousImage事件特别感兴趣。在文档中，所有的事件名称都是用.nanogallery2后缀(例如lightboxNextImage.nanogallery2)列出的，因此我猜想它们的使用方式与回调不同，但我已经尝试了我所能想到的一切。我尝试过的事情都失败了：

$("#nanogallery2").nanogallery2({
  items: images,
  "lightboxNextImage.nanogallery2": onImageDisplayed,
  thumbnailHoverEffect2: "scale120|labelSlideUp|toolsAppear", 
});

function onNextImage() {
  alert("Next Image")
}

$("#nanogallery2").nanogallery2({
  items: images,
  lightboxNextImage: onImageDisplayed,
  thumbnailHoverEffect2: "scale120|labelSlideUp|toolsAppear", 
});

function onNextImage() {
  alert("Next Image")
}

$("#nanogallery2").nanogallery2({
  items: images,
  lightboxNextImage.nanogallery2: onImageDisplayed,
  thumbnailHoverEffect2: "scale120|labelSlideUp|toolsAppear", 
});

function onNextImage() {
  alert("Next Image")
}

因为键名中的句点，最后一个甚至会抛出IntelliSense错误，但是我变得非常绝望。

有人能把我的痛苦发泄出来吗？我制作了一个Codepen 这里，在其中我一直在尝试各种徒劳无益的方法。

Answer 1

正如我所怀疑的那样，我是完全愚蠢的，这个问题的出现只是因为现在是午夜，我累了。为了让其他疲惫的灵魂在这里找到出路，解决方案是在代码中添加一个事件侦听器，如下所示：

$("#nanogallery2").on("lightboxNextImage.nanogallery2", function () {
    alert("Next Image");
});

这使用jQuery，但是由于NanoGallery2是一个jQuery插件，所以不会有问题。我已经用工作解决方案这里创建了一个更新的Codepen。

30秒后，我收到了这个问题。总是这样，不是吗？