Question

当我尝试加载运行时，我不断收到错误：

Erro：未被捕获的例外：[例外......“索引或大小为负或大于允许的数量“代码：”1“nsresult：”0x80530001 （NS_ERROR_DOM_INDEX_SIZE_ERR）“错误：b.data（this，r）未定义 jquery.colorbox-min.js

我需要加载它：

<a class="cboxElement" href="urlimg1.jpg" rel="example11111" title="title 1.">img1</a> <a class="cboxElement" href="urlimg1.jpg" rel="example11111" title="title 1.">img1</a> <a class="cboxElement" href="urlimg1.jpg" rel="example11111" title="title 1.">img1</a> <input type="button" onclick="loadColorBox()" value="load it!"/> <script> function loadColorBox(){ $("a[rel='example11111']").colorbox(); } </script>

有人可以帮忙吗？此致，迪奥戈

编辑---- 好的，这是对我有用的唯一方法：

<div class="galeria_imgs"> <a class="cboxElemento" title="Me and my grandfather on the Ohoopee." href="url1" rel="galeria_img_1">link1</a> <a class="cboxElemento" title="On the Ohoopee as a child" href="url2" rel="galeria_img_1">link2</a> <a class="cboxElemento" title="On the Ohoopee as an adult" href="url3" rel="galeria_img_1">link3</a> </div> <script type="text/javascript">// <![CDATA[ $(".cboxElemento").live("click", function(){ $("<a href="+$(this).attr("href")+" rel="+$(this).attr("rel")+" />").colorbox({ open:true, rel:'galeria_img_1', title:$(this).attr('title') }); return false; }); // ]]></script>

至少它从href链接正确加载图像但由于某种原因它没有意识到它是一个画廊，我试图强制rel：'galeria_img_1'但仍然无法工作......任何想法？

Answer 1

我无法重现您的错误消息。据我所知，您的代码看起来不错，您只需要在颜色框设置中添加open:true选项即可。此选项告诉colorbox现在打开（调用函数时），而不是在单击这些链接时打开。所以你的功能应该是这样的：

function loadColorBox(){
    $("a[rel='example11111']").colorbox({
        open: true
    });
}

Answer 2

使用OnClick加载ColorBox并非绝对必要。该插件内置了点击事件处理，当你在“vanilla”cuse案例中使用它时 - 它就是 - 它假设你做了甚至陷阱的插件。

如果您的用例是这样的：触发ColorBox从任意元素（在您的情况下为按钮）打开并显示来自任意集合的内容（ rel =“example11111”在你的情况下）它可以采取这种方式：

var $gallery = $('a[rel=example11111]').colorbox();   // Set the target gallery

$('button').click(function(e){   // Invoke Colorbox @ content element #1 on click of button
     e.preventDefault();   // stop default action by browser
     $gallery.eq(0).click();   // do a click event on the gallery to open Cbox
});

这将画廊内容的分配与调用ColorBox的事件分开。您还可以为按钮元素分配ID或类，以进行更精细的选择。

如何动态加载jQuery Colorbox插件？

2 个答案: