Question

我想使用javascript链接将图片添加到我的灯箱库中。例如，我试过，

<script>
imageArray =[
"image1.jpg",
"image2.jpg",
"image3.jpg"
];

function assignUrl(img_num)
    {
        return "www.website/images/" + imageArray[img_num];
    }
</script>

在我的画廊中，我用过，

<a href="javascript:document.location.href=assignUrl(0);"  
data-lightbox="imagegallery" >
<img src="javascript:document.location.href=assignUrl(0);" <!-- thumbnail-->        
</a>

但它不起作用..缩略图没有显示，当你点击时，图像继续加载但没有任何反应。

当我使用这样的测试链接时，它会显示图像。

<a href="javascript:document.location.href=assignUrl(0);"> TEST </a>

请帮帮忙？我究竟做错了什么？还有其他解决方法吗？

Answer 1

我编写了一个示例函数，用于根据imageArray变量动态创建和追加a和img元素。然后通过调用lightbox函数激活插件。

我不想尽可能多地触摸您的代码。

以下是它的外观：

<script>
    imageArray =[
        "image1.jpg",
        "image2.jpg",
        "image3.jpg"
    ];

    function assignUrl(img_num)
    {
        return "www.website/images/" + imageArray[img_num];
    }


    $(function() {
        for (var i = 0; i < imageArray.length; i++){
            var div = $("<a/>").attr("href",assignUrl(i)).attr("data-lightbox","imageGallery");
            div.append($("<img/>").attr("src",assignUrl(i)).attr("width","20%").attr("height","20%"));
            console.log($);
            $("body").append(div);    
        }
        $('a[rel="lightbox"]').lightBox();
    });

</script>

小提琴：http://jsfiddle.net/nilgundag/jTDk9/7/

Javascript链接到LIGHTBOX图像

1 个答案: