首页 > 解决方案 > 使用 Jquery 追加表时获取特定值的子键

问题描述

我创建了一个表并使用 Jquery 将来自 firebase 信息的所有用户数据库放入其中。问题是:我在表中有一个按钮,当您单击按钮控制台打印数据库中的元素键时,该按钮应该是。

var userDataRef = firebase.database().ref("User/3N2f2rJSSAZmFOdZEeJdlsuEZam2").orderByKey();

userDataRef.on('child_added', function(childSnapshot) {
  var key = childSnapshot.key;
  var childData = childSnapshot.val();         
  var title_val = childData.Title;
  var url_val = childData.Url;
    // Append data
    $("#data").append("<tr><td>" + title_val + "</td><td><a href=" + url_val + " target='_blank'> <button class='box'>GO</button></a></td><td><button id='del' class='box'>Delete</button></a></td><</tr>");


    $('#data').on('click', '#del', function(){
        console.log(key)
      });
                <table border="0" style="height: 63px; width: 100%;"> 
                    <thead> 
                        <tr> 
                            <div class="column middle" style="background-color:#f8f8f8;">
                            <td>Title</td> 
                            <td style="width: 40%;" >Link</td> 
                            <td style="width: 10%;" >Delete</td> 
                            </div>
                        </tr>                     
                    </thead>                 
                    <tbody id="data" > 
                  </tbody>                 
                  </table>


当此功能执行时,我会删除所有键,而不仅仅是来自确切原始的键

$('#data').on('click', '#del', function(){
        console.log(key)
      });


output : 
-LkT_afLi9nfn65OS2QJ database.js:17:17
-LkTciKQVEa2bsbtSwkW database.js:17:17
-LkTclDO8dYSBfgiBjAZ

标签: javascriptjqueryhtmlfirebasefirebase-realtime-database

解决方案


ID 不应该重复,而是使用按钮的类作为公共属性。


推荐阅读