jQuery FancyBox如何进行事件绑定

要在jQuery FancyBox中绑定事件，您可以使用on()方法。以下是一些示例，说明如何在FancyBox中绑定事件：

1. 在图片点击时打开FancyBox并触发afterShow事件：

$('a[href$=".jpg"]').fancybox({   afterShow: function () {     console.log('Image clicked, FancyBox opened.');   }, }); 

2. 为FancyBox中的标题绑定click事件：

$('a[href$=".jpg"]').fancybox({   afterShow: function (instance, slide) {     // 获取FancyBox标题元素     var title = $('.fancybox-title');      // 为标题元素绑定click事件     title.on('click', function () {       console.log('Title clicked.');     });   }, }); 

3. 在点击FancyBox外部时关闭FancyBox并触发beforeClose事件：

$('a[href$=".jpg"]').fancybox({   beforeClose: function (instance, slide) {     console.log('FancyBox will close now.');   }, });  // 点击页面任意位置关闭FancyBox $(document).on('click', function (e) {   if (!$(e.target).closest('.fancybox-container').length) {     $('.fancybox-close').click();   } }); 

请注意，为了确保事件正确绑定，您需要在文档加载完成后执行这些代码。您可以将这些代码放在$(document).ready()函数中，如下所示：

$(document).ready(function () {   // 在这里放置上述事件绑定代码 });