时间戳

首页 > 解决方案 > 带有单选按钮的数组键

javascript - 带有单选按钮的数组键

问题描述

我正在尝试使用每个单选按钮访问我的随机数组键我只想将单选按钮放置在键的数组上，allQuestions[index].anwsers并且它有 3 个索引键。

我做不到，这是我迄今为止的工作。

const allQuestions = [{
    question: "Which of them is from compton",
    anwsers: ["Nas", "Tupac", "Omarion", "Kendick"],
    correctAnswer: "Kendrick"
  },
  {
    question: "founder of HipHop",
    anwsers: ["Tupac", "Eazy E", "Kendick", "Bambata"],
    correctAnswer: "Bambata"
  },
  {
    question: "Who won BET Hip Hop Album 2018",
    anwsers: ["Kendrick", "Bruno", "Jay Z", "Drake"],
    correctAnswer: "Kendrick",
  },
  {
    question: "Best Female HipHop Art 2018",
    anwsers: ["Azelia", "Nicki", "Cardi_b", "Mama Rap"],
    correctAnswer: "Nicki"
  }
]

function render() {
  var index, unique;
  var print = '<ul>';
  for (i = 0; i < allQuestions.length; i++) {
    index = Math.floor(Math.random() * allQuestions.length);
  }

  var showQuiz = document.getElementById('showQuiz');
  var showAnswers = document.getElementById('showAnswers');

  showQuiz.style.color = 'red';
  showQuiz.innerHTML = allQuestions[index].question;
  showAnswers.innerHTML = allQuestions[index].anwsers;

  // I'm tryin to ue sthe unshift method here but it' not workin
  showAnswers.unshift('<input type="radio" value="allQuestions.anwsers[]');

}
<div id="question" style="text-align: center"> Quiz</div>
<button type="button" onclick="render()">Next Quiz</button>
<div id="showQuiz"></div>
<div id="showAnswers"></div>

标签： javascriptarraysobject

解决方案

您正在尝试写入一个 html 元素，这不是一个数组。您可能正在寻找更像这样的东西。

showAnswers.innerHTML = allQuestions[index].anwsers.map(function (answer){
        return '<input type="radio" name="answers" value="' + answer + '"/>' + answer
})

推荐阅读