javascript - 需要测验应用程序一次只显示一个项目

Question

我创建了一个测验应用程序，我希望该应用程序在用户参加测验时一次显示一个问题。这工作正常，直到我用超过 5 个问题填充数据库，现在测验显示所有问题，有人可以告诉我为什么会这样吗？

$(document).ready(function() {
    var steps = $('form').find(".questions");
    var count = steps.size();
    steps.each(function(i) {
        hider = i + count;

        if (count == i + 1) {
            var step = i + 1;
            $("#next" + step).on('click', submit);
        } else {
            $("#question_" + hider).hide();
            createNextButton(i);
        }

    });

    function submit() {
        $.ajax({
            type: "POST",
            url: "ajax.php",
            data: $('form').serialize(),
            success: function(msg) {
                $("#quiz_form,#demo1").addClass("hide");
                $('#result').show();
                $('#result').append(msg);
            }
        });
    }

    function createNextButton(i) {
        var step = i + 1;
        var step1 = i + 2;
        $('#next' + step).on('click', function() {
            $("#question_" + step).hide();
            $("#question_" + step1).show();
        });
    }
    setTimeout(submit, 50000);
});

PHP:

$response = $db->prepare("select * from questions WHERE test_ID = '" . $_POST['test_ID'] . "'");
$response->execute();

echo "<form method='post' id='quiz_form'>";

ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);

$count = 1;

while($result=$response->fetch(PDO::FETCH_ASSOC)) {

Answer 1

对于初学者来说，您的 hider 变量将始终是您的计数大小的 +1。如果您有 5 个问题的 .size()，那么(我假设)第一个迭代应该隐藏，即

hider = i + count
hider = 0 + 5
hider = 5
$("#question_5").hide();

但是，如果您在零索引的 PHP 端生成问题，那么您的最后一个问题(您的第 5 个问题)应该具有 question_4 的 ID .

如您所见，hider 变量永远不会小于 5，每次递增

steps.each(function(i) {
   hider = i + count;
   ...
});

hider 只会从 5 增加到 10(即 #question_10)，这在您的情况下不应该存在。

我想你可以通过使用

让事情变得更简单

$("#question_" + i).hide();