检查选择器是否为true在javascript中无法正常工作

我在HTML中有几个div，其中包含不同的背景图像。如果单击一个div，则会有一个选择器，该选择器将设置为true。例如，我有一个div“jogging”，如果我单击它，背景图像将从黑色变为橙色，选择的选择器jogging_将设置为true

var jogging_selected = false;
var soccer_selected = false;
var tennis_selected = false;
var golf_selected = false;

到目前为止还不错。现在我做了一个下一步按钮（#button_step3），它应该将这个部分的显示标签设置为none，但仅当选择了一个div时

它总是转到“else部分”，即使有一个选择器是真的，我真的不明白为什么

更新 我添加了console.log（选择了jogging_）；到if查询的else部分，他实际上记录了false。我真的不明白为什么，因为如果我重新点击div，他会变回黑色，只有当选择器为真时他才会这样做

---

以下是我的javascript、CSS和HTML代码（我将其分解为相关部分）：

$（文档）.ready（函数（）{
var jogging_selected=false；
var\u selected=false；
var\u selected=false；
所选变量=false；
函数setBackgroundAndSelector（儿童编号、图像路径\黑色、图像路径\橙色、活动\选择器）{
if（活动\选择器）{
$（childnumber）.css（“背景”，图像路径\黑色）
}
否则{
$（“.image\u activitys:nth child（1）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Jogging)" );
$（“.image\u activitys:nth child（2）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Soccer)" );
$（“.image\u activitys:nth child（3）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Tennis)" );
$（“.image\u activitys:nth child（4）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Golf)" );
点动_selected=false；
足球_selected=false；
所选网球=假；
高尔夫_selected=false；
对于（i=1；i
以下4个变量永远不会设置为true

var jogging_selected = false;
var soccer_selected = false;
var tennis_selected = false;
var golf_selected = false;

为什么？因为您只修改了参数
activity\u selector
的值，该参数是
setBackgroundAndSelector
的本地值。在
setBackgroundAndSelector
完成后，
activity\u selector
的值消失了。我认为您试图实现的是行为，即修改
activity\u selector
修改您传入的布尔变量（例如，
golf\u selected
），但布尔参数只能在JavaScript中使用

您可以稍微改变您的方法，并使用全局变量for state执行如下操作，以实现您想要的结果


$（文档）.ready（函数（）{
var sport_selected={}；
函数setBackgroundAndSelector（儿童编号、图像路径\黑色、图像路径\橙色、活动\选择器）{
如果（已选择运动[活动选择器]）{
$（childnumber）.css（“背景”，imagepath_橙色）
所选运动[活动选择器]=假；
}
否则{
$（“.image\u activitys:nth child（1）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Jogging)" );
$（“.image\u activitys:nth child（2）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Soccer)" );
$（“.image\u activitys:nth child（3）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Tennis)" );
$（“.image\u activitys:nth child（4）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Golf)" );
所选运动[“慢跑”]=错误；
所选运动[“足球”]=错误；
所选运动[“网球”]=错误；
所选运动[“高尔夫”]=错误；
对于（i=1；i
以下4个变量永远不会设置为true

var jogging_selected = false;
var soccer_selected = false;
var tennis_selected = false;
var golf_selected = false;

为什么？因为您只修改了参数
activity\u selector
的值，该参数是
setBackgroundAndSelector
的本地值。在
setBackgroundAndSelector
完成后，
activity\u selector
的值消失了。我认为您试图实现的是行为，即修改
activity\u selector
修改您传入的布尔变量（例如，
golf\u selected
），但布尔参数只能在JavaScript中使用

您可以稍微改变您的方法，并使用全局变量for state执行如下操作，以实现您想要的结果


$（文档）.ready（函数（）{
var sport_selected={}；
函数setBackgroundAndSelector（儿童编号、图像路径\黑色、图像路径\橙色、活动\选择器）{
如果（已选择运动[活动选择器]）{
$（childnumber）.css（“背景”，imagepath_橙色）
所选运动[活动选择器]=假；
}
否则{
$（“.image\u activitys:nth child（1）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Jogging)" );
$（“.image\u activitys:nth child（2）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Soccer)" );
$（“.image\u activitys:nth child（3）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Tennis)" );
$（“.image\u activitys:nth child（4）”）.css（“背景”，“url(http://dummyimage.com/128x128/000000/fff.png&text=Golf)" );
所选运动[“慢跑”]=错误；
所选运动[“足球”]=错误；
所选运动[“网球”]=错误；
所选运动[“高尔夫”]=错误；
对于（i=1；i
布尔类型的变量在函数中使用时由值使用，而不是由引用使用。
这里所做的是，函数setBackgroundAndSelector的第四个参数通过布尔变量的值传递。因此，原始变量（慢跑、足球、网球、高尔夫）无效