函数没有拾取改变的变量，它不是全局的吗？

Question

所以我有一个非常简单的测验，由 7 个选择框和一个提交按钮组成。我想要实现的是，如果没有任何选择框被更改，并且如果它们已被更改以显示分数，则会弹出警告错误。

我设置了一个名为“changed”的变量，它是假的。当其中一个选择框被更改时，“已更改”变为真......

这有效，我有一个控制台日志显示它的工作，但是当按下提交按钮时，它调用函数来显示分数或警告它似乎没有识别出“已更改”已更改为真的。

这是 Jquery...

var changed = false;

$('select').on('change', function () {

var changed = true;
console.log('TRUE');

});

$("#button").click( function(){

var correct = 0;

var selectValue;

var questions = document.getElementsByClassName("question");

var numOfQuestions = questions.length;

for(var i = 0; i < questions.length; i++ ){//begin for loop

//get the value of the select element
selectValue =  questions[i].options[questions[i].selectedIndex].value;

//if the value equals right
if(selectValue === "right"){//begin if then

//increment the correct variable
correct++;

}//end if then

}//end for loop



if(changed === false){
$('#scoreDisplay span').append('WARNING');
}
else{  

$('#scoreDisplay span').append(correct);

}
});

你可以在这里看到它，但是当你点击提交时你会看到它只是显示“警告”，不管你是否改变了任何选择框...http://gogeye.com/connectquiz/index.html

Answer 1

var changed 在此事件处理程序中的重新定义：

$('select').on('change', function () {

    // creates a new local variable that is only available inside this function
    var changed = true;
    console.log('TRUE');

});

创建一个新的局部变量，“隐藏”和“隐藏”在更高范围内声明的 changed 变量。

从您的函数内部删除var，这样它就不会创建该名称的新变量，而只是设置更高范围的变量：

var changed = false;

$('select').on('change', function () {

    // no var in front of this variable so you are just setting
    // the earlier one, not creating a new one
    changed = true;
    console.log('TRUE');

});

请记住，每当您在函数内声明带有var 的变量时，它都会定义一个仅在该函数内可用的新局部变量。如果它恰好与更高范围内的变量具有相同的名称，那么它会覆盖该变量名称，并且解释器在您引用它时使用本地名称而不是更高范围的变量。

Javascript 解释器进行范围搜索以解析变量引用。首先它在本地范围内查找。如果在那里找到它，那么它会使用它在那里找到的那​​个。如果在那里找不到它，它会查看下一个更高的范围。如果在那里找不到，它会上升到更高的范围，直到上升到全局范围。因此，它找到变量名称的最接近的范围是使用的范围 - 因此将首先使用 var 或 let 定义的局部变量。

Answer 2

从“var changed = true”中删除“var”

var changed = false;

$('select').on('change', function () {    
  changed = true;
  console.log('TRUE');    
});