javascript - 如何防止 Jquery colorbox 组在点击或鼠标弹起时启动？

Question

我正在使用 Colorbox 并且所有标准功能都可以正常工作。这个问题超出了正常的 colorbox 使用场景。

我需要能够在单击时拦截颜色框启动并在允许颜色框显示之前评估条件。所以我有一组图像(使用 rel)，当单击任何图像时，我希望能够运行我自己的代码来检查一些变量并决定是否允许显示颜色框弹出窗口。如果未设置条件，我想取消弹出窗口。我还没有在任何在线示例中看到执行此拦截/代码注入(inject)的简单方法，尽管我可能错过了一些东西。

Answer 1

关键是堆叠您的处理程序并使用较早的处理程序将对 colorbox 的调用短路。这应该可以，但我还没有测试过:

首先在 colorbox 声明的前面注册一个点击处理程序，如下所示:

$('a.gallery')
  .on( 'click', onClickGallery )
  .colorbox({rel:'gal'});

如果不满足您的条件，则立即停止传播:

onClickGallery = function ( event ) {
  var is_allowed = checkIsAllowed();
  if ( ! is_allowed ) { 
    event.stopImmediatePropagation();
    event.preventDefault();
    return false;
  }
  return true;
};

我一直在生产中做这种事情。祝你好运!