【问题标题】:Javascript Personality QuizJavascript个性测验
【发布时间】:2014-04-10 15:58:53
【问题描述】:

我是 Javascript 新手,需要帮助进行个性测验,就像在 Buzzfeed 上找到的一样(例如:http://www.buzzfeed.com/justinabarca/which-goonies-character-are-you

我想创建一个接受用户输入并计算的表单,方法是添加用户输入的相应字符[x]AnswerArray 值,他们最喜欢哪个字符。

我有一个二维数组,用于存储每个问题和每个问题的每个答案。

var questionArray = [
                    ["Question 1?", "Answer 1", "Answer 2", "Answer 3"], 
                    ["Question 2?", "Blue", "Green", "Red"], 
                    ["Question 3?", "Blue", "Green", "Red"], 
                    ["Question 4?", "Blue", "Green", "Red"], 
                    ["Question 5?", "Blue", "Green", "Red"], 
                    ["Question 6?", "Blue", "Green", "Red"]
                ];

我在“For-Next”迭代中显示它:

for (var i = 0; questionArray.length; i++){
document.write("<span class='question'>" + questionArray[i][0] + "</span><br/><br/>");
for (var x = 1; x < 4; x++){
    document.write("<input type='radio' class='answer' name='answer' value='" + questionArray[i][x] + "'>" + questionArray[i][x] + "<br/><br/>");
}

我还为每种可能性(在本例中为字符)提供了一个二维数组:

var characterOneAnswerArray = [
                    ["0, 1, 4"],
                    ["2, 3, 6"],
                    ["1, 3, 0"],
                    ["2, 4, 5"],
                    ["0, 0, 1"]
              ];

这就是我卡住的地方。如何跟踪(存储)用户输入(答案)然后将它们添加到每个字符总数中,然后最终计算哪个字符的得分最高?

如果你不明白我的意思,请告诉我

【问题讨论】:

  • 你是哪种程序员? A. 学习者。 B. One who looks for the answers elsewhere without showing an honest attempt first :p - 到目前为止你展示了你的代码很好,但你还没有展示任何真正的尝试。
  • @NiettheDarkAbsol 哈哈 我是那种学习/正在学习的程序员,非常扭曲。我的知识非常零散,从几种语言中获取概念,却没有真正、完全掌握任何一种。信不信由你,我已经为此工作了几个星期,诚然不是全职,尝试了几种方法和语言(首先在 PHP 中尝试过)。我已经没有耐心了,决定采取简单的方法在这里发布一个问题。
  • 啊,伙计,我读了标题,并认为这是一个测验,以确定我作为 JavaScript 开发人员的个性。

标签: javascript html arrays forms multidimensional-array


【解决方案1】:

http://jsbin.com/yufej/1/edit

这是一项复杂的任务,但让我们逐步完成:

1- 为输入的点击添加事件监听器

var inputs = document.getElementsByTagName('input');
for(var i = 0; i < inputs.length; i++){
  inputs[i].addEventListener('click', check);
}

2- 检查是否所有问题都已回答

function check(){
  userAnswers = [];
  var c = 0;
  for(var i = 0; i < inputs.length; i++){
    if(inputs[i].checked) {
      userAnswers.push(i%3);
      c++;
    }
  }
  if(c==questionArray.length) rate();
}

3- 对每个字符的答案进行评分

function rate(){
  for(var i = 0; i < userAnswers.length; i++){
    for(var j = 0; j < characterAnswer.length; j++){
      characterAnswer[j][4] = 0;
      for(var x = 0; x < 4; x++){
        if(userAnswers[i] == characterAnswer[j][x])
          characterAnswer[j][4]++;
      }
    }
  }
  answer();
}

4- 答案是……

function answer(){
  var a = 0, t;
  for(var j = 0; j < characterAnswer.length; j++){
    if(characterAnswer[j][4] > a) {
      a = characterAnswer[j][4];
      t = characterAnswer[j][3];
    }
  } 
  alert(t);
}

请注意document.write 是一种不好的做法,您应该将其替换为document.createElementdocument.body.appendChild

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-12-12
    • 1970-01-01
    相关资源
    最近更新 更多