我有一个问题,我需要首先从 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/