javascript - 转到本地服务器上的 nextURL

Question

在测验中获得正确答案后，我需要转到下一个 URL。我有一项任务，要创建一个测验游戏，其中包含来自大学服务器的问题。当该人正确时，游戏会通过 XMLHttpRequest 在服务器上获取下一个问题。我怎样才能在这里使用“nextURL”或者没有这样的术语？

function Question () {
 let quizQuestion = new window.XMLHttpRequest()
 quizQuestion.open('GET', 'http://vhost3.lnu.se:20080/question/1')
 quizQuestion.onload = function () {
   let ourData = JSON.parse(quizQuestion.responseText)
   let questionDiv = document.querySelector('#question')
   questionDiv.innerText = ourData.question
 }
 quizQuestion.send()
 answer()
}

function answer () {
    let quizQuestion = new window.XMLHttpRequest()
    let answerDiv = document.querySelector('#answer')
    let button = document.createElement('button')
    button.type = 'button'
    button.setAttribute('id', 'send')
    button.innerText = 'Answer'
    answerDiv.appendChild(button)

button.addEventListener('click', function () {
    quizQuestion.open('POST', 'http://vhost3.lnu.se:20080/answer/1')
    quizQuestion.setRequestHeader('Content-type', 'application/json')
    quizQuestion.send(JSON.stringify({answer: inputText.value}))

    quizQuestion.onreadystatechange = function () {
    console.log(quizQuestion.response)
    let ourAnswer = JSON.parse(quizQuestion.responseText)
    let answerDiv = document.querySelector('#answer')
    answerDiv.innerText = ourAnswer.message
    }
  })
}

因此，如果 ({answer: inputText.value}) 中的值正确，我想转到下一个问题，在本例中位于 quizQuestion.open('GET ', 'http://vhost3.lnu.se:20080/question/21')

Answer 1

根据您所写的内容，在任何给定时刻，“下一个网址”似乎都会是给您的列表中的下一个，并且由您决定如何在之后检索适当的网址一个正确的答案。

我们假设您作业中的问题编号是非连续的(在示例中从问题 1 移动到问题 21)，并且没有重复的问题。服务器上是否有按您需要的顺序排列的问题列表？如果列表在数组中，您可以根据当前问题的索引来访问它吗？

如果没有，假设您已经知道所需顺序的问题列表，您可以在自己的代码中执行此操作。假设您将问题编号放入数组中，并存储当前问题编号，如下所示:

let questionNums = [1,21,14,9,6,23]
let currQuestionNum = questionNums[0]

这可以让您将所需的问题编号连接到您的基本 URL 上，如下所示

'http://vhost3.lnu.se:20080/question/' + currQuestionNum.toString().  

然后，当您检查答案是否正确时，您可以转到数组中的下一个问题:

if (questionNums.indexOf(currQuestionNum)+1 != questionNums.length){
  currQuestionNum = questionNums[questionNums.indexOf(currQuestionNum)+1]
}
else{
  //end the quiz
}

要将其与上面的串联示例一起使用，您需要修改问题和答案函数以接受问题编号作为参数:

function Question (questionNum) {
 let quizQuestion = new window.XMLHttpRequest()
 quizQuestion.open('GET', 'http://vhost3.lnu.se:20080/question/'+questionNum)
 quizQuestion.onload = function () {
   let ourData = JSON.parse(quizQuestion.responseText)
   let questionDiv = document.querySelector('#question')
   questionDiv.innerText = ourData.question
 }
 quizQuestion.send()
 answer(questionNum)
}

function answer (questionNum) {
    let quizQuestion = new window.XMLHttpRequest()
    let answerDiv = document.querySelector('#answer')
    //Local answerNum variable
    let answerNum = questionNum
    let button = document.createElement('button')
    button.type = 'button'
    button.setAttribute('id', 'send')
    button.innerText = 'Answer'
    answerDiv.appendChild(button)

button.addEventListener('click', function () {
    quizQuestion.open('POST', 'http://vhost3.lnu.se:20080/answer/'+answerNum)
    quizQuestion.setRequestHeader('Content-type', 'application/json')
    quizQuestion.send(JSON.stringify({answer: inputText.value}))

    quizQuestion.onreadystatechange = function () {
    console.log(quizQuestion.response)
    let ourAnswer = JSON.parse(quizQuestion.responseText)
    let answerDiv = document.querySelector('#answer')
    answerDiv.innerText = ourAnswer.message
    }
  })
}

请注意本地 answerNum 变量 - 添加此变量是为了，如果 quesitonNum 在 click 事件上调用匿名函数之前发生更改，则该值不会受到影响。