0

目前我正在网站上开发 Colorbox 插件..

我在一个页面中有一组链接..(比如链接将是 50)..

此链接包含一些数据。即,每个链接包含一个页面。单击我的链接时,我想在颜色框中显示此页面。

为此,我使用了颜色框。它仅适用于我首先单击的第一个链接。如果我单击同一页面中的另一个链接,颜色框将不起作用。

它显示一个错误,如..

未捕获的类型错误:对象 [object Object] 没有方法“colorbox”

我有这样的链接。

<a href="link1" id="dynamicid" class="colorbox"></a>
<a href="link2"  id="dynamicid" class="colorbox"></a>
<a href="link3" id="dynamicid" class="colorbox"></a>
<a href="link4" id="dynamicid" class="colorbox"></a>

我使用下面的代码来调用颜色框。

 $(document).ready(function () {

     jQuery(".colorbox").on("click",function(event) {
                  console.log('i am here...');
                    event.preventDefault();
                    var elementURL = jQuery(this).attr("href");                     var elementID = jQuery(this).attr("id");
                    jQuery("#"+elementID).colorbox({href: elementURL, innerWidth: 1000, innerHeight: 700});
                  }); 

 });

我也尝试过直播而不是直播,但没有得到任何结果。

4

1 回答 1

2

在我看来,每次用户单击链接时,您都不需要初始化颜色框。

您应该立即初始化它们,然后这些链接将按您的预期工作。

HTML

<a class="color-anchor" href="http://www.bbc.co.uk/">BBC</a>
<a class="color-anchor" href="http://edition.cnn.com/">CNN</a>

JS

$(function(){
    $("a.color-anchor").colorbox({href:$(this).attr("href") ,innerWidth: 700, innerHeight: 500, iframe:true});
});

希望这对你有帮助。

于 2013-11-08T11:05:32.040 回答