Javascript：在数组中循环项目

对于我的网站，我需要一个循环中有问题和解答的函数。最后一个问题后，第一个问题应该再次出现。Javascript：在数组中循环项目

我发现了一些东西，但循环不起作用，这当然很简单，但我不明白。

<!DOCTYPE html> 
 
<html> 
 
<body> 
 

 
<div> 
 
       <div id="question" onclick="changeText()"> 
 
        Start Quiz 
 
</div>     
 
       <div id="answer" onclick="nextQuestion()"> 
 
        are you ready? 
 
</div> 
 
</div> 
 

 
<script type="text/javascript"> 
 
    var details = "Question 1ans:Answer 1qst:Question 2ans:Answer 2qst:Question 3ans:Answer 3qst:Question 4ans:Answer 4qst:Question 5ans:Answer 5qst:Question 6ans:Answer 6qst:Question 7ans:Answer 7qst:Question 8ans:Answer 8qst:Question 9ans:Answer 9qst:Question 10ans:Answer 10"; 
 
    
 
    var questionList = details.split("qst:"); 
 
    
 
    var div = document.getElementById('question'); 
 
    var ans = document.getElementById('answer'); 
 
    
 
    function changeText(){ 
 
    if (div.style.display !== 'none') { 
 
     div.style.display = 'none'; 
 
    ans.style.display = 'block'; 
 
     } 
 
     else { 
 
     div.style.display = 'block'; 
 
    ans.style.display = 'none'; 
 
     } 
 
    } 
 

 
    function nextQuestion(){ 
 
     div.style.display = 'block'; 
 
    ans.style.display = 'none'; 
 
    var max = questionList.length; 
 
    if(max > 0){ 
 
    var num = 0; 
 
    
 
     var qst = questionList[num].split("ans:"); 
 
     div.innerHTML =qst[0]; 
 
     ans.innerHTML = qst[1]; 
 
     questionList.splice(num,1);} 
 
     else { 
 
      
 
    \t \t \t \t 
 
     } 
 
    } 
 
    
 
</script> 
 

 
</body> 
 
</html>

来源

2017-05-27 Frank

，必须重置的n值每次达到max，所以你必须把n外范围，全局变量范围，因为要遍历数组不拼接questionList再次达到结束的之后：

var details = "Question 1ans:Answer 1qst:Question 2ans:Answer 2qst:Question 3ans:Answer 3qst:Question 4ans:Answer 4qst:Question 5ans:Answer 5qst:Question 6ans:Answer 6qst:Question 7ans:Answer 7qst:Question 8ans:Answer 8qst:Question 9ans:Answer 9qst:Question 10ans:Answer 10"; 
 

 
var questionList = details.split("qst:"); 
 

 
var div = document.getElementById('question'); 
 
var ans = document.getElementById('answer'); 
 

 
//Variable n must declare here 
 
var num = 0; 
 

 
function changeText() { 
 
    if (div.style.display !== 'none') { 
 
    div.style.display = 'none'; 
 
    ans.style.display = 'block'; 
 
    } else { 
 
    div.style.display = 'block'; 
 
    ans.style.display = 'none'; 
 
    } 
 
} 
 

 
function nextQuestion() { 
 
    div.style.display = 'block'; 
 
    ans.style.display = 'none'; 
 
    var max = questionList.length; 
 
    if (max > 0) { 
 

 
    var qst = questionList[num].split("ans:"); 
 
    div.innerHTML = qst[0]; 
 
    ans.innerHTML = qst[1]; 
 
    //there is no need to splice questionList 
 
    //questionList.splice(num, 1); 
 
    num++; 
 
    //Check for num to not to be greater than questionList.length 
 
    if (num >= max) 
 
     num = 0; 
 
    } else { 
 

 

 
    } 
 
}

<div id="question" onclick="changeText()"> 
 
    Start Quiz 
 
</div> 
 
<div id="answer" onclick="nextQuestion()"> 
 
    are you ready? 
 
</div>

来源

2017-05-27 10:44:03

谢谢正是我在找的东西。 – Frank

@Frank如果是这样请接受它并投票up.Thank你提前 –

Javascript：在数组中循环项目

回答

相关问题