【问题标题】:fancybox 2 - supply image list at runtimefancybox 2 - 在运行时提供图像列表
【发布时间】:2013-04-15 18:35:45
【问题描述】:

是的,我是 JS 新手……我承认。我有一个页面,其中包含地址列表和旁边的各种图标。一个图标应该会显示该地址的图片库 2。照片本身最初并未显示在页面上,而是按需加载。我正在尝试传递地址 ID 和照片数量以生成列表。但是,当我调用它时,它只是用 PhotoList 的字符串值而不是照片来调出花式框。

function DisplayPhotos(ID, PhotoCount) {
    var PhotoList = '';
    for (k = 1; k <= PhotoCount; k++) {
        PhotoList += "{href: 'http://mydomain.com/images/image-" + MUID + "-" + k + ".jpg'},";
    }

    $.fancybox.open([PhotoList], {
        padding: 0,
        helpers: {
            title: {
                type: 'outside'
            },
            thumbs: {
                width: 68,
                height: 50
            }
        }
    });
    return false;
}

如果我手动将它们输入到函数中,它就可以工作。现在,我被困住了……想法?

【问题讨论】:

    标签: javascript jquery fancybox fancybox-2


    【解决方案1】:

    原来这是一个类型转换问题。 Fancybox 期待一个数组,但接收到一个字符串。查看更新的代码:

    function DisplayPhotos(MUID, PhotoCount) {
    
        var PhotoList = '';
    
        for(k=1;k <= PhotoCount; k++){
    
            PhotoList += "http://mydomain.com/images/image-"+MUID+"-"+k+".jpg,";
    
        }
    
        PhotoList = PhotoList.substring(0, PhotoList.length - 1);
        var PhotoArray = PhotoList.split(',');
    
    
        $.fancybox.open(
    
            PhotoArray
    
        , {
    
            padding:0,
            helpers:{
    
                title:{
                    type:'outside'
                },
                thumbs:{
                    width:68,
                    height:50
                }
            }
    
        });
    
        return false;
    
    }
    

    【讨论】:

    • 您可以使用jQuery.parseJSON 解析字符串,查看类似的答案stackoverflow.com/a/10240551/1055987。此外,如果您使用花括号 {} 设置多个名称/值对(hreftitle 等),则可能需要形成正确的 JSON string format
    • 现在你先创建一个字符串值,然后再将它拆分成一个数组……你为什么不首先创建一个数组呢?
    猜你喜欢
    • 2020-09-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-01-21
    • 2023-03-09
    • 1970-01-01
    相关资源
    最近更新 更多