【问题标题】：Resetting score to 0 after quiz completed测验完成后将分数重置为0
【发布时间】：2016-04-06 10:18:31
【问题描述】：

问题

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

直播链接：https://s3.amazonaws.com/bsunproduction/yearinreview/index.html

scripts.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();
});

【问题讨论】：

标签： javascript jquery function counter reset

【解决方案1】：

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

在 resetQuiz

中使用 score = 0; 而不是 var score = 0;

【讨论】：

【解决方案2】：

您在 resetQuiz 中再次声明分数

function resetQuiz() {
    //var score = 0;
    // should be
    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);
}

由于局部变量 score 设置为零，因此不会反映在外部 score 变量中。

【讨论】：

【解决方案3】：

更改var score = 0; to score = 0;

对所有情况执行此操作，但最初的情况除外。在 javascript 中，可以有两个具有相同名称的变量。所以当你说：

var 分数 = 0;

您正在创建一个新变量，然后将其设置为 0。原来的变量仍然具有旧值。

【讨论】：