Question

我做了某种类型的猜词游戏，基于向用户显示某些单词的描述，并将用户输入的值与预定义的单词进行比较。我实施的逻辑如下：

在全局范围内，有一个包含对象的数组（例如，arr = [{desc1，word1}，{desc2，word2} ......]
点击“开始”按钮，我想显示第一个对象的描述（desc）。（例如，arr [0] .desc）
用户输入一些单词并按“提交”按钮。
在'提交'按下，程序检查用户输入的单词是否与数组内的单词相同（第一次运行时为word1）。然后，程序根据比较结果进行随机填充。
程序然后迭代到数组中的下一个对象并继续到最后一个对象。
然后它显示迭代结束后的最终结果。

我遇到的问题是循环运行猖獗（infinte-loop）或直接转到最终结果而不做任何东西。

我不知道如何让程序等待/停止，直到用户输入内容并按下提交然后迭代循环。不能使用if-else循环，因为除非我使用某种setTimeout（）为用户提供足够的时间来输入东西，但是它似乎很笨拙而且只是一些创可贴方法，否则将永远是真的。

解决这类问题还有其他逻辑吗？谢谢。

Answer 1

我可以想到两个简单的解决方案。

1）使用prompt查找检索用户输入（在用户回答之前停止脚本）

示例：

var questions = [...]; // assuming content objects look like {word:"...", description:"..."}

for(var i in questions){
    var userInput = prompt( questions[i]["description"] ); // prompt() stops the script until user answers

    if(userInput == questions[i]["word"]){  // compare user input with value from object
        // [handle correct guess]
    } else {
        // [handle incorrect guess]
    }
}
// [Game Ended]

2）如果不想使用提示对话框，而不是循环显示问题，我建议一次只显示一个问题，并将显示选项的索引存储在一个额外的全局变量中。在提交按钮的处理程序中，递增索引并询问下一个问题。

示例：

var questions= [ ... ];
var currentIndex = 0;

function askNextQuestion(){
    if(currentIndex < questions.length){
        var currentQuestion = questions[currentIndex];
        // [Display the question]
    } else {
        // [Game Ended]
    }
}
function start(){      // call this function from Start handler
    currentIndex = 0;  // set question index to 0
    askNextQuestion(); // ask the question
}
function submitPressed(){ // call this function from Submit handler
    // [handle answer]
    currentIndex++;      // go to next question
    askNextQuestion();   // ask the question
}

关于在Javascript迭代之前等待用户输入的逻辑

1 个答案: