Question

我尝试使用foreach循环来访问我的firebase数据库并填充5个按钮并删除了答案。抛出的错误是

FIREBASE WARNING: Exception was thrown by user callback. file:///Users/michaelheneghan/Desktop/CS353C/JudgingPage.html:229:69
https://cdn.firebase.com/js/client/2.4.1/firebase.js:200:357
ka@https://cdn.firebase.com/js/client/2.4.1/firebase.js:35:276
ka@https://cdn.firebase.com/js/client/2.4.1/firebase.js:35:270
ka@https://cdn.firebase.com/js/client/2.4.1/firebase.js:32:467
R@https://cdn.firebase.com/js/client/2.4.1/firebase.js:83:381
forEach@https://cdn.firebase.com/js/client/2.4.1/firebase.js:200:327
file:///Users/michaelheneghan/Desktop/CS353C/JudgingPage.html:226:33
https://cdn.firebase.com/js/client/2.4.1/firebase.js:202:714
gc@https://cdn.firebase.com/js/client/2.4.1/firebase.js:52:166
cc@https://cdn.firebase.com/js/client/2.4.1/firebase.js:30:218
dc@https://cdn.firebase.com/js/client/2.4.1/firebase.js:29:1261
Kb@https://cdn.firebase.com/js/client/2.4.1/firebase.js:221:289
[native code]
Ld@https://cdn.firebase.com/js/client/2.4.1/firebase.js:189:253
[native code]
Ld@https://cdn.firebase.com/js/client/2.4.1/firebase.js:179:366
https://cdn.firebase.com/js/client/2.4.1/firebase.js:177:282
zh@https://cdn.firebase.com/js/client/2.4.1/firebase.js:171:466
onmessage@https://cdn.firebase.com/js/client/2.4.1/firebase.js:170:247

TypeError: undefined is not an object (evaluating 'document.getElementsByTagName('button')[counter].textContent = data.child("ChosenAnswer").val()')

我尝试了各种方法，当我打印到控制台时，正在显示正确的信息，所以我知道我给它正确的道路。

我尝试使用setInterval函数减慢它的速度，这是回调方法的一个问题，但仍然没有变化。 GameRef实际上是一个变量，存储与他们所处的游戏编号有关的数字。

var GameRef = localStorage.getItem("GameRef"); //get the game reference from previous page to pull data down from database
var counter = 0; 
var vals = "";
var trsfAns = "";
var check = "";
console.log(GameRef);

var ref = new Firebase("https://cau-maynooth.firebaseio.com/Game/Game " + GameRef); // Store a link to location of current game
console.log("Ref is " + ref);

ref.on("value", function(snapshot) {
        snapshot.forEach(function(data) { // Loop through each submitted answer and display on buttons for user choice
          var name = data.child("ChosenAnswer").val();
          console.log(name);
            document.getElementsByTagName('button')[counter].textContent = data.child("ChosenAnswer").val();
            counter++; // increment counter to display snapshot data on next button

        });
});

计数器最初设置为0，上面的节点恰好有5个子节点。我已经尝试将信息存储为变量并输入，但得到相同的错误。

以下是数据的存储方式，我试图访问并显示＆＃34; ChosenAnswer＆＃34;的数据：

    {
  "Game" : {
"Game 1" : {
  "-KF8s5IxnxgRabSEyrVk" : "Option number 3",
  "-KF8s7XSeocBwiJQDgY5" : "Option number 1",
  "-KF8sAB-9c74mEaDLlB-" : "Option number 4",
  "-KF8sBLAo8FozBOoiptS" : "Option number 1",
  "-KF8sDBtZ9lvcNXeuxI8" : "Option number 5"
},
"Game 2" : {
  "-KFQnS7qCqFEgRRGZ2NV" : {
    "ChosenAnswer" : "Option number 5",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  },
  "-KFQo38x_7MlKMHBUB9G" : {
    "ChosenAnswer" : "Option number 5",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  },
  "-KFQoJ2HT0pioUs8kLgL" : {
    "ChosenAnswer" : "Option number 1",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  },
  "-KFQocb61r3LVg_cs8HY" : {
    "ChosenAnswer" : "Option number 1",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  },
  "-KFQooYUTsf_zgKt9xwQ" : {
    "ChosenAnswer" : "Option number 6",
    "ID" : "5f9ff985-fc3b-48d7-83b4-e28751c1ba66"
  }

我知道这可能是一些非常基本的东西，我不了解Firebase，但我是新手，希望有人能伸出援助之手。

非常感谢！

******** EDITED ********************* ***************

最初我只在Firebase上存储了所选答案，并且下面的代码有效。我改变它以包括他们的UID，因为我想能够为用户分配硬币等，如果他们赢了游戏，现在它不起作用（见上文）。

ref.on("value", function(snapshot) {
        snapshot.forEach(function(data) { // Loop through each submitted answerand display on buttons for user choice
            document.getElementsByTagName('button')[counter].textContent = data.val();
            counter++; // increment counter to display snapshot data on next button

        });
});

<button type="button" class="btn btn-primary btn-lg btn-block"  onclick="selectedAnswer(1)"><label id="s1" for="subOpt1"></label></button>
  <button type="button" class="btn btn-default btn-lg btn-block"  onclick="selectedAnswer(2)"><label id="s2" for="subOpt2"></button>
  <button type="button" class="btn btn-primary btn-lg btn-block"  onclick="selectedAnswer(3)"><label id="s3" for="subOpt3"></button>
  <button type="button" class="btn btn-default btn-lg btn-block"  onclick="selectedAnswer(4)"><label id="s4" for="subOpt4"></button>
  <button type="button" class="btn btn-default btn-lg btn-block"  onclick="selectedAnswer(5)"><label id="s5" for="subOpt5"></button>

firebase使用foreach更改text的按钮内容

0 个答案: