Question

我需要一些关于多项选择测验的代码的帮助，但它也需要真/假选项。我有一个代码，可以通过3个选项对多项选择题进行测验，这很好。但是当我想要一个带有2个选项的真/假问题时，它不会隐藏最后一个选项，而是显示上一个问题的第三个选项。我尝试了几乎所有的东西，但我无法弄清楚如何隐藏t / f问题中的第三个选项。以下代码是我使用的代码。＆＃34; yolo＆＃34;在一个选项中代表应该隐藏的选项。有可能隐藏吗？

$(function() {

var currentQuestion = null;
var questionIndex = 0;

// Your list of questions. Each question has an answer (either a,b or c)
// and then a set of "options" in the question
var questions = [

  { 
      'answer': 'a',
      'question': 'Wat is de correcte syntaxis in een HTML om te verwijzen naar een extern JS bestand:',
      options: ['<script src="xxx.js">', '<script name="xxx.js">', '<script href="xxx.js">']
  },
  { 
      'answer': 'c',
      'question': 'Welk teken is het teken voor JQuery in JQuery:',
      options: ['Het ? teken', 'Het % teken', 'Het $ teken']
  },
  {
      'answer': 'b',
      'question': 'Wat is JQuery van JavaScript?',
      options: ['Een uitbreiding (meer mogeliijkheden)', 'Een simpele versie (minder codes voor meer)', 'Hetzelfde (alleen de titel is anders)']
  },
  {
      'answer': 'b',
      'question': 'JQuery kan je direct gebruiken in een HTML bestand?',
      options: ['Juist','Onjuist', 'yolo']
  },

];

// Detect when the submit button is clicked and check if the question
// was answered correctly
$('input[type="submit"]').click(function() {
    var val = $('#questions').find('input:checked').val();
    if(currentQuestion) {
        if(currentQuestion.answer == val) {
            alert("Goed zo!");
            showQuestion();
        } else {
            alert("Jammer, probeer het nog eens.");
        }
    }
    return false;
});

// Set the value of an option in the question
function setRadioLabel(radioId, text) {
     $('label[for="' + radioId + '"]').find('span.ui-btn-text').text(text);
};

// Show a random question
function showQuestion() {
    // Grab next question, and increment so we get a new one next time
    var random = questions[questionIndex++ % questions.length];

    $('#question').text(random.question);

    $('input[type="radio"]').attr('checked', false).checkboxradio('refresh');

    setRadioLabel('radio1', random.options[0]);
    setRadioLabel('radio2', random.options[1]);
    setRadioLabel('radio3', random.options[2]);
    currentQuestion = random;
};

// Start the question stuff off
showQuestion();
});

另一个问题。测验永远不会结束，当测验有所有问题时，它会再次以问题1开始。是否有可能以最后一个问题结束测验？

测验（问题和选项）是荷兰语。这也是我发布的第一个问题，所以它可能不正确（正确的地方和方式等等）。

我忘了说JQuery版本是1.9.1，而JQueryMobile版本是1.3.1。由于某种原因，它仍然无法正常工作。据我所知，我尝试了3个答案。有人可以按照他（或她）认为应该有效的方式编辑整个文件。

Answer 1

您可以将广播标签代码更改为循环，然后它可以处理任意数量的选项（2,3,4,100 ...）。这样，您不需要'yolo'选项，只需将选项列表设置为您想要提供的选项数。

for(var i = 0; i < random.options.length; i++)
{
  setRadioLabel('radio' + i.toString(), random.options[i]);
}

不确定语法是否完全正确，它是完全未经测试的，并且它非常接近您的需要：）

另一方面，你没有任何东西可以停止加载问题。每次页面加载时（在初始加载时和每次提交后），它都会选择一个问题并显示它。如果questionIndex％questions.length为0，您可以检查一下，然后显示Test Complete消息而不是显示问题。或者只是删除mod运算符以确保您只查看一次问题列表并设置条件来控制它：

function showQuestion() {
  // Grab next question, and increment so we get a new one next time
  if (questionIndex < questions.length) {
    var random = questions[questionIndex++];

    $('#question').text(random.question);

    $('input[type="radio"]').attr('checked', false).checkboxradio('refresh');

    for(var i = 0; i < random.options.length; i++)
    {
      setRadioLabel('radio' + i.toString(), random.options[i]);
    }
    currentQuestion = random;
    return;
  }
  // TODO: Code to show a Test Complete message and score here

};

Answer 2

从格式化json对象开始。你的钥匙不应该是字符串：

var questions = [

  { 
      answer: 'a',
      question: 'Wat is de correcte syntaxis in een HTML om te verwijzen naar een extern JS bestand:',
      options: ['<script src="xxx.js">', '<script name="xxx.js">', '<script href="xxx.js">']
  },
  { 
      answer: 'c',
      question: 'Welk teken is het teken voor JQuery in JQuery:',
      options: ['Het ? teken', 'Het % teken', 'Het $ teken']
  },
  {
      answer: 'b',
      question: 'Wat is JQuery van JavaScript?',
      options: ['Een uitbreiding (meer mogeliijkheden)', 'Een simpele versie (minder codes voor meer)', 'Hetzelfde (alleen de titel is anders)']
  },
  {
      answer: 'b',
      question: 'JQuery kan je direct gebruiken in een HTML bestand?',
      options: ['Juist','Onjuist', 'yolo']
  }


];

回答第二个问题，您可以使用splice方法从数组中删除已使用的对象：

questions.splice((Math.floor(Math.random()*(questions.length))),1);
console.log(questions);

它删除范围[0，数组大小]

中随机索引的项目

如果您需要更多帮助，请将您的整个代码与jsFidle（http://jsfiddle.net/）中的js和html一起使用，如果您需要更多帮助

多项选择测验还有真/假选项

2 个答案: