javascript - 如何使用 for 语句和数组确定单击了哪个元素
问题描述
我有 8 个用户可以选择的框,如果他们选择框 1 - 它应该提醒框 1 已被选中。这同样适用于所有 8 个盒子。现在,我正在以 1/10 秒的间隔运行一个 for 循环,它应该检查哪个框被单击,然后根据 switch 语句输出警报。
运行代码时,提示框 8 一直被选中,我不知道如何选择框
- 这些框是在 HTML 文档中设置的空 div,其 id 在数组中引用
编辑: clearInterval(interval); 在其当前位置工作,但每次单击都会输出错误
“未捕获的 ReferenceError:未定义间隔”
^ 有什么想法吗?
页面加载:
$(function() { //On page load
var interval = setInterval(buttonClick, 100);
});
按钮点击功能
function buttonClick() {
//INITIALIZING ARRAY
var displayBox = [$("#boxOne-line-one"), $("#boxTwo-line-one"), $("#boxThree-line-one"), $("#boxFour-line-one"), $("#boxFive-line-one"), $("#boxSix-line-one"), $("#boxSeven-line-one"), $("#boxEight-line-one")];
var slidePos = 0;
for (let i = 0; i <= 7; i++) {
(ii => {
displayBox[ii].click(function() {
slidePos = ii;
console.log(slidePos);
wbox(slidePos);
clearInterval(interval);
});
})(i);
}
}
切换语句函数,“哪个框”
function wbox(slidePos) {
switch(slidePos) {
case 0:
alert("BOX 1 SELECTED");
break;
case 1:
alert("BOX 2 SELECTED");
break;
case 2:
alert("BOX 3 SELECTED");
break;
case 3:
alert("BOX 4 SELECTED");
break;
case 4:
alert("BOX 5 SELECTED");
break;
case 5:
alert("BOX 6 SELECTED");
break;
case 6:
alert("BOX 7 SELECTED");
break;
case 7:
alert("BOX 8 SELECTED");
break;
}
}
实际:“选择框 8”
预期:正确的框
解决方案
您需要更改循环以避免i
成为全局:
for (let i = 0; i < 7; i++) {
(ii => {
displayBox[ii].click(function() {
slidePos = ii;
console.log(slidePos);
wbox(slidePos);
clearInterval(interval);
});
})(i);
}
推荐阅读
- python - 根据行索引之一的内容命名数据框列
- javascript - 如何将状态 isActive:false 更改为 true
- rust - 为什么必须冗余指定指针特征边界?
- keras - 为什么 keras Batchnorm 中只有一个动量参数?
- jsf - 带分页的素人脸数据表,数据表放在Tab里面
- c++ - 在我的 C++ 冒泡排序代码中,当我按升序输入输入时,我的输出出现问题
- python - 如何使 json 解析检查代码更短或更易读?
- python - 相同的端点(Bing Visual Search API),但 Python 脚本和 PHP 脚本的结果不同
- typescript - 如何在 Typescript 中使用动态枚举器(上限量词数)克服枚举类型上的 TS2589
- python - Scrapy 不会在我的目录中写入文件,所以我看不到