javascript - 测验完成后将分数重置为 0

Question

问题

我在页面底部有一个 resetQuiz() 测验按钮，该按钮应该将分数设置回 0，但如果该人得到了 25 个正确答案，则单击 .button__reset 然后再次进行测验，它变为 26 而不是 0。

实时链接:https://s3.amazonaws.com/bsunproduction/yearinreview/index.html

脚本.js

/*-------------------------------------
QUIZ
--------------------------------------*/

// Keep track of score
function showScoreBox() {
    var scrollDepth = $(window).scrollTop();
    var divPosition = $(".quiz__header").offset().top - 45;
    var windowWidth = $(window).width();
    // console.log(windowWidth);

    if (scrollDepth > divPosition && (windowWidth > 768)) {
        $(".quiz__score").show();
        $(".quiz__score--mobile").hide();
    } else {
        $(".quiz__score").hide();
        $(".quiz__score--mobile").show();
    }
} showScoreBox();

$(window).on("scroll", function(){
    showScoreBox();
});

$(window).on("resize", function(){
    showScoreBox();
});

var score = 0;

$(document).on("click", ".quiz__response", function(){
    $(this).siblings().addBack().addClass("is--unclickable");
    $(this).siblings().show("quiz__info");  // Show extra info
    console.log("Clicked");

    if ($(this).hasClass("answer--true")) {
        $(this).addClass("is--true");
        $(this).find("i").show();
        $(this).siblings().find("i").show();

        // Update score
        score++
        console.log(score);
        $(".quiz__correct").html(score);
        $(".quiz__correct--mobile").html(score);
        rainConfetti();
    } else {
        // $(this).addClass("is--true");
        // $(this).siblings().addClass("is--false");
        // $("quiz__info").removeClass("is--false");
        $(this).addClass("is--false");
        $(this).find("i").show();
        $(this).siblings().find("i").show();
    }
});

/*-------------------------------------
RESET
--------------------------------------*/

function resetQuiz() {
    var score = 0;
    $(".quiz__response").removeClass("is--true is--false");
    $(".quiz__response").removeClass("is--unclickable");
    $(".fa-check").hide();
    $(".fa-times").hide();
    $(".quiz__correct").html(score);
    $(".quiz__correct--mobile").html(score);
}

$(".button__reset").on("click", function(){
    var score = 0;
    $("canvas").hide();
    resetQuiz();
});

Answer 1

您正在创建一个新变量并为其分配值 0 而不是全局变量。

在 resetQuiz 中使用 score = 0;，而不是 var Score = 0;