获取项目上的项目键

时间:2017-10-02 19:27:59

标签: javascript firebase web firebase-realtime-database

我有一个id = bigTable的表,其中我附加了从我的firebase数据库中检索的一些项目。现在我想要的是点击一个项目来获取它的密钥。我的功能如下:

var itemKey;  

//READ FROM DATABASE
function readFromDatabase() {


    var database = firebase.database();
    database.ref("posts").child(currentCountry)     
        .on('value', function(snapshot){

    if(snapshot.exists()){
        var content = null;


        $('#bigTable').empty();          


        snapshot.forEach(function(data){                

            var val = data.val();

            itemKey = data.key;


            content +='<tbody>';
            content +='<tr>';
            content +='<td width="100px" height="100px">';
            content +='<img src="' + val.imageString + '" width="100%" onClick="getKey()">'+'</img>';

            content +='</td>';

            content +='<td>';
            content +='<table>';
            content +='<tbody>';    

            content +='<tr>';   
            content +='<td>' + val.country+ '</td>';   
             content += '</tr>';

            content +='<tr>';   
            content +='<td>' + val.category + '</td>';   
             content += '</tr>';

            content +='<tr>';   
            content += '<td>' + val.city + '</td>';                
            content += '</tr>';


            content +='</tbody>';
            content +='</table>';
            content += '</tr>';
            content += '</tbody>';          


        });

        $('#bigTable').append(content);
    }
});


}   



 function getKey(){

console.log(itemKey);

}

但是当我点击某个项目的图像时,我得到的东西始终是第一个项目的关键。那么如何才能获得我点击的项目的键?

1 个答案:

答案 0 :(得分:0)

您应该列出itemKeys而不是单个变量。对于此行itemKey = data.key;中的每个子项,将覆盖该变量。所以你应该相应地改变你的代码。我将在我的例子中使用一个数组,但我相信你可以做得更好。

var itemKey; 

var itemKeys = [];

并在forEach循环中将密钥添加到列表

var index = 0
snapshot.forEach(function(data) {
   itemKeys[0] = data.key;
   ...

然后你的功能看起来像这样

function getKey(position) {
    console.log(itemKeys[position]);
}

现在你必须指定你想获得钥匙的物品的位置。 我的Javascript不是最好的,您可以考虑使用不同的方法,但这是一般的想法,您可以查看ES6标准。