javascript - 在 Firebase 中加载数据时运行 JQuery

标签 javascript jquery firebase

我有一个问题,我需要首先从 Firebase 数据库获取图像链接,然后我调用 JQuery 代码,它将以一种漂亮的方式组织图像 >> 但似乎 Jquery 在我获取图像之前运行, 请帮助 ..!

JS函数

new Firebase("https://zoominp.firebaseio.com/photos/"+imageID)
    .once('value', function(snap)
    {
        link = snap.child('imageLink').val();
        link = 'images/'+link;
        var id = "img";
        div.innerHTML += "<a href=http://unitegallery.net><img data-description=aaaaa alt=HHHH data-image="+link+" src="+link+"></a>";
    });

JQuery

jQuery("#gallery").unitegallery(
{
    tiles_type:"nested",
    tiles_nested_optimal_tile_width:200
});

最佳答案

Firebase 异步加载(并同步)数据。因此,您拥有的 jQuery 代码确实会在数据从服务器返回之前执行。

要解决此问题,请将 jQuery 代码移至 Firebase 回调中:

var ref = new Firebase("https://zoominp.firebaseio.com/photos/"+imageID);
ref.on('value', function(snap) {
    link=snap.child('imageLink').val();
    link='images/'+link;
    var id="img";
    div.innerHTML = div.innerHTML +"<a href=http://unitegallery.net><img data-description=aaaaa alt=HHHH data-image="+link+" src="+link+"></a>";
    jQuery("#gallery").unitegallery({
        tiles_type:"nested",
        tiles_nested_optimal_tile_width:200
    });
 });

我还将once()更改为on()。通过这个微小的更改,只要数据库中的数据发生变化,您的 HTML 就会更新。尝试更改数据,您将体验 Firebase 的“魔力”。

由于异步加载在您第一次遇到它时很难理解,因此我强烈建议您阅读这些问题的更深入的答案:

关于javascript - 在 Firebase 中加载数据时运行 JQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35383337/

相关文章:

javascript - CryptoJS 解密 Malformed UTF-8 数据错误

javascript - jQuery : Automatic type conversion during parse JSON

ios - 火存储 : How to get the object data from firestore in IOS (Swift) and display it in tableview

android - Google Firebase 用户名注册

javascript - 仅将纯文本粘贴到可编辑的 div 中

javascript - 从 CRM 2011 表单的表单标题中检索字段

javascript - 在 asp.net MVC 中实现搜索与tinyMCE编辑器发生冲突

jQuery ASP.NET 通过 CheckBox 标签的 innerHTML 在 CheckBoxList 中查找特定的 CheckBox

javascript - jQuery 滑动 Div

android - 如何将 HTTP 可调用云函数响应转换为 POJO?