Question

我正在从javascriptissexy进行测验。

动态（使用document.getElementById或jQuery）删除当前问题，并在用户单击“下一步”按钮时添加下一个问题。 “下一步”按钮将是导航此版本测验的唯一按钮。

如何删除当前问题+答案列表并动态显示新答案？它现在工作正常，但认为它要求我从问题更平滑过渡。

function nextQuestion(){

    j++;
    currentQuestion.innerHTML = allQuestions[j].question;

    for(var i = 0; i < allQuestions[j].choices.length; i++){
        currentChoices[i].innerHTML = allQuestions[j].choices[i];
    };

};

Answer 1

您可以使用班次

删除

    function nextQuestion() {
        var question = allQuestions.shift();
        currentQuestion.innerHTML = question.question;
        for (var i = 0; i < question.choices.length; i++) {
            currentChoices[i].innerHTML = question.choices[i];
        };
    };

Answer 2

在替换内容之前，您必须隐藏，更改内容然后再次显示

 $("#question").fadeOut("slow", function(){
     $("#question_content").html(allQuestions[question].question);
     for(var i = 1; i <= allQuestions[question].choices.length; i++){
          $("#choise"+i).html(allQuestions[question].choices[i-1]);
     };
     $("#question").fadeIn("slow");                    
});

请参阅JSFiddle http://jsfiddle.net/en4rt9o7/

上的此示例

如何显示/更改数组内容？

2 个答案: