所以，我正在制作一個(gè)測驗(yàn)游戲，我想從數(shù)組生成答案，我嘗試了一些解決方案，但它不起作用，所以我需要你對(duì)我的代碼的解決方案。這是常量const shekitxva = [{ questions: 'What was created first', answers:[ {text: 'Egg', correct: 'false'}, {text: 'Chicken', correct: 'true'}, {text: 'Eleniko', correct: 'false'}, {text: 'Computer', correct: 'false'} ]}]這是問題顯示kitxva.innerText = shekitxva[0].questions;那么如何將這些答案顯示給 div 元素javascriptvar pasuxebi = document.querySelectorAll('.pasuxebi');var checkBtn = document.querySelector('.check');var nextBtn = document.querySelector('.next');var startBtn = document.querySelector('.start');var kitxva = document.querySelector('h3');var pasuxebiBox = document.querySelector('.pasuxebi');超文本標(biāo)記語言 <div class="box"> <h3 class="none">Question</h3><div class="pasuxebi none"> <div class="pasuxi">pirveli</div> <div class="pasuxi">pirveli</div> <div class="pasuxi">pirveli</div> <div class="pasuxi">pirveli</div></div><div class="buttons"> <div class="start">Start</div> <div class="check none">Check</div> <div class="next none">Next</div> </div>
2 回答
慕勒3428872
TA貢獻(xiàn)1848條經(jīng)驗(yàn) 獲得超6個(gè)贊
您必須在后端驗(yàn)證答案，因?yàn)橛脩艨梢钥吹侥那岸舜a，您不應(yīng)該顯示哪個(gè)答案是正確的，要在元素之間循環(huán)，您可以執(zhí)行以下操作：
const shekitxva = [
{
questions: 'What was created first',
answers: [
{ text: 'Egg', correct: 'false' },
{ text: 'Chicken', correct: 'true' },
{ text: 'Eleniko', correct: 'false' },
{ text: 'Computer', correct: 'false' }
]
}
]
let quAnswers = shekitxva[0].answers;
var pasuxebi = document.querySelectorAll('.pasuxi');
for (i=0;i<quAnswers.length ; i++) {
pasuxebi[i].innerHTML = quAnswers[i].text ;
}
您需要為您的答案容器分配一個(gè)名稱參數(shù)（如分配data-value），并將所選答案與容器名稱一起發(fā)送到后端進(jìn)行驗(yàn)證，但即使在您的 JavaScript 中也不要顯示哪個(gè)答案是正確的，因?yàn)橛脩艨梢钥吹剿．?dāng)您想知道如何循環(huán)并生成答案文本時(shí)，上面的代碼為您提供了線索，
如果您有超過 1 個(gè)問題，您應(yīng)該循環(huán)遍歷父項(xiàng)，然后訪問子項(xiàng)，使用它們的索引來訪問您的數(shù)組及其對(duì)象
米脂
TA貢獻(xiàn)1836條經(jīng)驗(yàn) 獲得超3個(gè)贊
您可以在數(shù)組上使用映射函數(shù)來映射數(shù)組，例如“foreach”
const array1 = [1, 4, 9, 16];
// pass a function to map
const map1 = array1.map(x => x * 2);
console.log(map1);
// expected output: Array [2, 8, 18, 32]
所以你可以做這樣的事情
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph</p>
<p id="demo"></p>
<script>
const shekitxva = [
{
questions: 'What was created first',
answers: [
{ text: 'Egg', correct: 'false' },
{ text: 'Chicken', correct: 'true' },
{ text: 'Eleniko', correct: 'false' },
{ text: 'Computer', correct: 'false' }
]
},
{
questions: 'What was created second',
answers: [
{ text: 'Egg', correct: 'false' },
{ text: 'Chicken', correct: 'true' },
{ text: 'Eleniko', correct: 'false' },
{ text: 'Computer', correct: 'false' }
]
},
{
questions: 'What was created third',
answers: [
{ text: 'Egg', correct: 'false' },
{ text: 'Chicken', correct: 'true' },
{ text: 'Eleniko', correct: 'false' },
{ text: 'Computer', correct: 'false' }
]
}
]
let inputs = '';
shekitxva.map(qst => {
inputs += '<h3>' + qst.questions + '</h3>';
qst.answers.map(ans => {
inputs += '<p>' + ans.text + ' is ' + ans.correct + '<p>';
})
})
document.getElementById('demo').insertAdjacentHTML('afterbegin', inputs);
</script>
</body>
</html>
- 2 回答
- 0 關(guān)注
- 130 瀏覽
添加回答
舉報(bào)
0/150
提交
取消