Question

我的colorbox有问题：

我有一个页面可以通过AJAX接收部分内容。现在在ajax检索内容中也有Colorbox链接。现在这些链接不起作用，或者更确切地说第一次点击不起作用（但是会导致浏览器中的链接除了彩色框内的链接），现在在第一次点击之后（这不会像前面描述的那样工作），点击浏览器的后退按钮，所有其他链接将在彩色框中显示 - 如图所示。

我尝试了几个浏览器都具有相同的结果。所以我想 - 特别是因为在出错之后才正常工作 - 这可能是让彩盒库不在缓存中的问题。所以我试着在ajax检索到的内容中添加这行代码（除了在主页面上）

<script type="text/javascript" src="/js/jquery.colorbox-min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".cbDetails").colorbox();
}
</script>

这导致上面解释的错误不再发生，而是加倍和褪色彩色盒层，这就是说，这意味着，在击中2个不同的彩盒链接之后，需要2次点击才能关闭彩色盒，之后点击3个不同colorboxes需要3次点击才能关闭那些第三个颜色框，依此类推......

正如我被要求这样做，这是相关的代码：

现在这是主页，包括：

<script type="text/javascript">var currentTime = '<? print date("F d, Y H:i:s", time())?>';</script>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery.colorbox-min.js"></script>
<script type="text/javascript" src="/js/superfish.js"></script>
<script type="text/javascript" src="/js/custom.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $(".cbDetails").colorbox();
});
</script>

以及身体然后：

echo '<a href=\'cb.script.php?do=order&id='.$check['id'].'&prod='.$check['prod'].'\' class="cbDetails"><button style="width:60px;" class="order" title="Ordern">Ordern</button></a>';

这将创造出良好的效果。但如果我有第二部分，那么一个：

echo '<a href=\'cb.script.php?do=order&id='.$check['id'].'&prod='.$check['prod'].'\' class="cbDetails"><button style="width:60px;" class="order" title="Ordern">Ordern</button></a>';

通过AJAX放在同一页面上它不再适用（虽然让AJAX对我来说至关重要）。

Answer 1

可能是您正在使用某个类进行选择，$(".cbDetails").colorbox();将适用于该类的所有元素，并打开您正在描述的大量窗口。尝试使用ID或$(this)更具体地定位您的点击次数。

$(document).ready(function(){
  $(".cbDetails").on("click", function()
    {$(this).colorbox();});
});

Colorbox JQuery，colorbox没有显示或加倍

1 个答案: