从 JSON 获取标题

Question

我被困住了！.. 我有一个 jQuery 脚本，其中我从 JSON 文件填充图像库，它就像灯箱类型的东西。 但我想要为我的图像添加一个标题，因此我创建了第二个 JSON 文件，我只在其中保留图像名称和标题。 我想在循环中检查第二个 JSON 是否存在图像名称，如果存在，则返回作为标题的文本...

这是titles.json

[
    {"Img" : "fun1_001.jpg", "title" : "Title of image 001"},
    {"Img" : "fun1_002.jpg", "title" : "title of image 002"},
    {"Img" : "fun1_003.jpg", "title" : "title of image 002"}
]

我想要做的是循环遍历所有图像，填充图库，同时如果图像名称存在于titles.json中，则将该标题放入循环中。

这是填充图库的 jQuery。它调用一个名为 GetTitle(imagename,folder) 的函数

   //Load the gallery if you click the dropdown.
        $(document).on('click','#zmenu>div.item', function(){
            $('#dc_preload_image').empty();
            let zGallery=$(this).attr('data-value');
            $.getJSON('JSON/Gallerys/'+zGallery+'.json', { get_param: 'value' }, (data)=>{ 
                $.each(data, function(index, element) {
                console.log('anrop')
                    $('.galpop-info').galpop();
                    $("#dc_preload_image").preloader();    
                    $('#dc_preload_image').append('<li><a class="galpop-info" data-galpop-group="info"  title="'+GetTitle(element.imageName, zGallery)+'" href="BKND/Galleries/'+zGallery+'/pict/'+element.imageName+'"><img src="BKND/Galleries/'+zGallery+'/tmb/'+element.imageName+'" alt="'+element.imageName+'" id="'+element.imageName+'" class="corners" /></a></li>');
                });
            });
        });

这个函数应该匹配循环中的图像名称并返回标题。

function GetTitle(a,z){
    $.getJSON('BKND/Galleries/'+z+'/titles.json', (adata) => {
        // Handle the JSON data here  
        let zTitle         
    $.grep(adata, function(value) {
        if(value.Img = a){
            zTitle = value.title;
        }
        else{zTitle = " ";}
    });
    console.log(zTitle)
    return zTitle
});
}

无论我如何尝试，我都无法做到正确。当我将代码放入循环中的函数内时，我几乎解决了，但随后它迭代它并在图库中创建了双倍图像。

Answer 1

你的问题似乎已经在 Stackoverflow 上有了答案。您可以使用回调（您将一个函数作为参数提供给您的函数，然后使用标题参数调用回调函数，而不是返回标题）。否则，您可以使用 Promise，但需要使用异步。

回调示例：

function GetTitle(a,z, callback){
    $.getJSON('BKND/Galleries/'+z+'/titles.json', (adata) => {
        // Handle the JSON data here  
        let zTitle         
    $.grep(adata, function(value) {
        if(value.Img = a){
            zTitle = value.title;
        }
        else{zTitle = " ";}
    });
    console.log(zTitle)
    callback(zTitle)
});
}