使用for循环来压缩代码

我有以下代码,我想浓缩成for循环,但不知道如何。 我试着查看其他post但是卡住了。

共有15个数字,所以类似于(i = 1; i <= 15; i ++)

if(checksquare1save=="true"){ $("#checksquare1").toggleClass("checksquareON"); } else{ $("#checksquare1").removeClass("checksquareON"); } if(checksquare2save=="true"){ $("#checksquare2").toggleClass("checksquareON"); } else{ $("#checksquare2").removeClass("checksquareON"); } if(checksquare3save=="true"){ $("#checksquare3").toggleClass("checksquareON"); } else{ $("#checksquare3").removeClass("checksquareON"); } if(checksquare4save=="true"){ $("#checksquare4").toggleClass("checksquareON"); } else{ $("#checksquare4").removeClass("checksquareON"); } if(checksquare5save=="true"){ $("#checksquare5").toggleClass("checksquareON"); } else{ $("#checksquare5").removeClass("checksquareON"); } if(checksquare6save=="true"){ $("#checksquare6").toggleClass("checksquareON"); } else{ $("#checksquare6").removeClass("checksquareON"); } if(checksquare7save=="true"){ $("#checksquare7").toggleClass("checksquareON"); } else{ $("#checksquare7").removeClass("checksquareON"); } if(checksquare8save=="true"){ $("#checksquare8").toggleClass("checksquareON"); } else{ $("#checksquare8").removeClass("checksquareON"); } if(checksquare9save=="true"){ $("#checksquare9").toggleClass("checksquareON"); } else{ $("#checksquare9").removeClass("checksquareON"); } if(checksquare10save=="true"){ $("#checksquare10").toggleClass("checksquareON"); } else{ $("#checksquare10").removeClass("checksquareON"); } if(checksquare11save=="true"){ $("#checksquare11").toggleClass("checksquareON"); } else{ $("#checksquare11").removeClass("checksquareON"); } if(checksquare12save=="true"){ $("#checksquare12").toggleClass("checksquareON"); } else{ $("#checksquare12").removeClass("checksquareON"); } if(checksquare13save=="true"){ $("#checksquare13").toggleClass("checksquareON"); } else{ $("#checksquare13").removeClass("checksquareON"); } if(checksquare14save=="true"){ $("#checksquare14").toggleClass("checksquareON"); } else{ $("#checksquare14").removeClass("checksquareON"); } if(checksquare15save=="true"){ $("#checksquare15").toggleClass("checksquareON"); } else{ $("#checksquare15").removeClass("checksquareON"); } 

我试过这个,但它没有用

  for (i = 1; i <= 15; i++){ if(checksquare + i + save=="true"){ $("#checksquare" + i).toggleClass("checksquareON"); } } 

编辑:

应该提到我上面有这些变量

  checksquare1save = localStorage['ScienceSkills-basicSkillsCheck-check1-7868-2171-1085-5119-4672'] checksquare2save = localStorage['ScienceSkills-basicSkillsCheck-check2-6582-7209-6435-8487-6994'] checksquare3save = localStorage['ScienceSkills-basicSkillsCheck-check3-5367-9000-3502-5810-2295'] checksquare4save = localStorage['ScienceSkills-basicSkillsCheck-check4-2961-8359-5106-2702-5132'] checksquare5save = localStorage['ScienceSkills-basicSkillsCheck-check5-5801-5256-5838-2934-5277'] checksquare6save = localStorage['ScienceSkills-basicSkillsCheck-check6-1162-2208-7274-5156-3693'] checksquare7save = localStorage['ScienceSkills-basicSkillsCheck-check7-6178-4335-3148-1809-8066'] checksquare8save = localStorage['ScienceSkills-basicSkillsCheck-check8-6609-6032-4539-4243-6273'] checksquare9save = localStorage['ScienceSkills-basicSkillsCheck-check9-6261-3580-7658-7073-1914'] checksquare10save = localStorage['ScienceSkills-basicSkillsCheck-check10-1504-7246-1864-4465-1319'] checksquare11save = localStorage['ScienceSkills-basicSkillsCheck-check11-6400-3954-7124-3585-2086'] checksquare12save = localStorage['ScienceSkills-basicSkillsCheck-check12-8303-8392-7301-5154-8007'] checksquare13save = localStorage['ScienceSkills-basicSkillsCheck-check13-1207-8834-5941-3315-8893'] checksquare14save = localStorage['ScienceSkills-basicSkillsCheck-check14-3089-4036-1427-2614-7399'] checksquare15save = localStorage['ScienceSkills-basicSkillsCheck-check15-2750-4976-5357-6403-2979'] 

如果您的变量在全局范围内,这应该有效:

  for (i = 1; i <= 15; i++){ if(window['checksquare' + i + 'save']=="true"){ $("#checksquare" + i).toggleClass("checksquareON"); } else{ $("#checksquare" + i).removeClass("checksquareON"); } } 

你最好使用数组checksquaresave并将所有checksquaresave推入其中然后像你正在做的那样循环数组。 它需要一些重构,但它会在以后为你节省一些痛苦。

 for (i = 1; i <= 15; i++){ if(checksquare[i] == 'true'){ $("#checksquare" + i).toggleClass("checksquareON"); } } 

显示您拥有的代码时,我能想到的唯一解决方案是使用eval 。 忘记我说了,但是因为你不想尝试那个解决方案。 拥有15个类似命名的变量可能是一个问题。 如果“checksquaresave”变量是全局变量,您可以使用window.variableNamewindow["variableName"]来检索它们。 在这种情况下,它看起来像:

 if (window["checksquare" + i + "save"] == "true") 

否则,最好检查checksquare ## save变量的创建,并将它们设置为数组而不是单独的变量。 然后,您的代码可能如下所示:

  for (i = 1; i <= 15; i++){ if(checksquaresave[i] =="true"){ $("#checksquare" + i).toggleClass("checksquareON"); } } 

如果要仅在运行时访问您知道名称的变量,可以将它们存储为对象的属性。

因此,如果您想访问checksquare1save,checksquare2save等,您可以这样做:

 var storage = { checksquare0save:true, checksquare1save:true, checksquare2save:false, //...other variables... } for (var i = 0; i < 15, i++) { console.log(storage["checksquare" + i + "save"]) } 

你现在正在做的代码将检查3个变量的值:checksquare,i&save,而不是一个。

更好的方法是将所有数据放入一个数组中并完成此操作。

如果你有一个数组:checksquaresave。 然后你可以填写你的价值观:

 checksquaresave[0] =value0, checksquaresave[1] =value1 , ... 

在此之后,代码将如下所示:

 for (i = 1; i <= 15; i++){ if(checksquaresave[i] =="true"){ $("#checksquare" + i).toggleClass("checksquareON"); } } 

编辑:正如@Archer提到的(以及其他答案)你可以使用

 window["checksquare" + i + "save"] 

同样,但我认为最好的方法是使用数组。 (cfr。 在javascript中使用window [“variable”+ i] )