重置计数器，重新开始

Reset counter and start over again

本文关键字：重新开始 计数器      更新时间：2023-09-26

我试图在jquery中做一个测验，从用户那里得到答案，用正确的答案检查它，然后显示结果。

我想让我的测验在完成一轮后重新开始。代码在第一轮工作得很好，但是当我再次启动它时，它只显示第一个问题，而不继续。

怎么了??

小提琴的链接在这里

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="score">Score: <span id="scr"></span>/10</div>
<div class="correct">Correct</div>
<div class="incorrect">Incorrect</div>
<div class="qstart">start</div>
<div class="qarea">
    <div class="question">Father</div>
    <div class="canswer">Vater</div>
    <textarea class="abox"></textarea>
</div>
<div class="qarea">
    <div class="question">My father</div>
    <div class="canswer">Mein Vater</div>
    <textarea class="abox"></textarea>
</div>
<div class="qarea">
    <div class="question">Land</div>
    <div class="canswer">Land</div>
    <textarea class="abox"></textarea>
</div>
<div class="qarea">
    <div class="question">Mother</div>
    <div class="canswer">Mutter</div>
    <textarea class="abox"></textarea>
</div>
<div class="qarea">
    <div class="question">Brother</div>
    <div class="canswer">Bruder</div>
    <textarea class="abox"></textarea>
</div>
<div class="qarea">
    <div class="question">City</div>
    <div class="canswer">Stadt</div>
    <textarea class="abox"></textarea>
</div>
<div class="qarea">
    <div class="question">Woman</div>
    <div class="canswer">Frau</div>
    <textarea class="abox"></textarea>
</div>
<div class="qarea">
    <div class="question">Man</div>
    <div class="canswer">Mann</div>
    <textarea class="abox"></textarea>
</div>
<div class="qsubmit">submit</div>
<div class="startagain">startagain</div>
CSS

 .score {
        float:right;
        display:block;
    }
    .question {
        float:left;
    }
    .next {
        float:left;
        margin:10px;
    }
    .qsubmit {
        float:left;
        margin:10px;
    }
    .correct {
        float:right;
        display:block;
    }
Jquery

$(document).ready(function () {
    //declare variables
    var qarea = $(".qarea");
    var totalqarea = qarea.length - 1;
    var startagain = $(".startagain");
    var canswer = $(".canswer")
    var qsubmit = $(".qsubmit");
    var counter = 0;
    //hide unrequired 
    qsubmit.hide();
    startagain.hide();
    $("startagain")
    $(".correct,.incorrect").hide();
    qsubmit.hide();
    $(".canswer").hide();
    qarea.hide();
    var qstart = $(".qstart");
    //intiate click on start
    qstart.click(function () {
        var counter = 0;
        qsubmit.show();
        qarea.eq(counter).show();
        qstart.hide();
        var i = 1;
        //loop();    function loop() 
        //initate submit
        qsubmit.bind("click", function () {
            var ma = canswer.eq(counter).text();
            var mal = ma.toLowerCase();
            var ua = $("textarea").eq(counter).val();
            var ual = ua.toLowerCase();
            var n = mal.localeCompare(ual);
            // checks correct answer and gives score
            if (n == 0) {
                $(".correct").show();
                $("#scr").text(i);
                i = i + 1;
                qsubmit.html("continue");
                //gives incorrect     
            } else {
                $(".incorrect").text("correct answer is " + ma).show();
                qsubmit.html("continue");
            }
            // increase counter
            counter = counter + 1;
            qarea.eq(counter - 1).hide();
            qarea.eq(counter).show();
            if (totalqarea == counter) {
                qsubmit.hide();
                qstart.text("start again").show();
                qarea.eq(counter).hide()
                qstart.click(function () {
                    //loop();return;
                })
            }
        })
    })
})

重置你的计数器，它将工作。

        if (totalqarea == counter) {
            qsubmit.hide();
            qstart.text("start again").show();
            qarea.eq(counter).hide()
            counter = 0;
相关文章：