Javascript 每次调用onclick函数时显示不同的文本

我有以下代码，试图从firebase数据库中提取用户：

function pullFromDB(){
        usersRef.on('value', function(snapshot) {
          function next_user(){
            for (user in snapshot.val().users){
              document.getElementById("users").innerHTML = user
            }
          }

到目前为止，它只返回一个用户，因为我相信它必须遍历整个users数组，然后将姓氏放入“users”元素中。

---

如何迭代到数组中的下一项，并在每次单击按钮时显示不同的名称？

我不知道DB返回了什么，但首先尝试使用

控制台.log（）

查看结果的类型。如果您正在处理数组或其他数据类型，这将为您提供答案

如果是数组，则代码：

for (user in snapshot.val().users){
              document.getElementById("users").innerHTML = user
}

它迭代整个数组，

.innerHTML

将

user

字符串作为最后一次迭代。如果您想在每次单击按钮时对其进行更改，则需要一个变量，该变量将包含当前应用于id=“users”的integer of index

然后，每次单击都需要将变量增加1。

---

下面是一个在JS中使用数组的示例

我不知道DB返回了什么，但首先尝试

console.log（）

查看结果的类型。如果您正在处理数组或其他数据类型，这将为您提供答案

如果是数组，则代码：

for (user in snapshot.val().users){
              document.getElementById("users").innerHTML = user
}

它迭代整个数组，

.innerHTML

将

user

字符串作为最后一次迭代。如果您想在每次单击按钮时对其进行更改，则需要一个变量，该变量将包含当前应用于id=“users”的integer of index

然后，每次单击都需要将变量增加1。

---

下面是一个在JS中使用数组的示例

您正在迭代整个数组，只显示最后一个。您只需要分配一个索引并使用它

我不知道您的剩余代码，但根据给定的信息，这应该是关键：

i = 0;

function pullFromDB(){
  usersRef.on('value', function(snapshot) {
    lastnames = Object.keys(snapshot.val().users); // get all keys, in your case the last names
    function next_user(){
      user = lastnames[i];
      document.getElementById("users").innerHTML = user;
      i++; // increase after click
      // when you want to access more information of the user, you can do it like this (as an example)
      // user_id = snapshot.val().users[user].id;
    }

---

您正在迭代整个数组，只显示最后一个。您只需要分配一个索引并使用它

我不知道您的剩余代码，但根据给定的信息，这应该是关键：

i = 0;

function pullFromDB(){
  usersRef.on('value', function(snapshot) {
    lastnames = Object.keys(snapshot.val().users); // get all keys, in your case the last names
    function next_user(){
      user = lastnames[i];
      document.getElementById("users").innerHTML = user;
      i++; // increase after click
      // when you want to access more information of the user, you can do it like this (as an example)
      // user_id = snapshot.val().users[user].id;
    }

---

这可能是因为它是对象列表而不是数组，所以返回未定义的。当我这样做时：

console.log（snapshot.val（）.users）

我得到

对象{Mike:Object，Oli:Object，Pete:Object，Rich:Object，k:Object}

但是如果我得到：

console.log（snapshot.val（）.users[i]）我得到
未定义
好的，这解释了很多。我相应地更新了我的答案。您需要首先获取所有姓氏，然后将其作为索引进行迭代。这可能是因为它是对象列表而不是数组，所以返回未定义的。当我这样做时：
console.log（snapshot.val（）.users）
我得到
对象{Mike:Object，Oli:Object，Pete:Object，Rich:Object，k:Object}
但是如果我得到：
console.log（snapshot.val（）.users[i]）我得到
未定义
好的，这解释了很多。我相应地更新了我的答案。您需要首先获取所有姓氏，然后将其作为索引进行迭代。