代码之家 › 专栏 › 技术社区 › cyka

强制JavaScript等待单击(循环)

callback asynchronous arrays javascript

cyka · 技术社区 · 3 年前

我有4个不同颜色的按钮,我想根据给定的数组检查我的点击。

:每次都会给我单击的结果,并且每次“i”都会增加。

var arrColor = ['blue', 'yellow', 'green', 'red', 'blue', 'blue', 'yellow', 'blue', 'blue', 'yellow', 'yellow', 'green', 'green', 'blue', 'yellow'];

var i = 0;
for (var i = 0; i < 15; i++) {
    $(".btn").click(function (event) {
        console.log(i); // check on i
        if (arrColor[i] === event.target.id) {
            console.log("great");
        }
        else {
            console.log("Wrong");
        }
    });

}

1 回复 | 直到 3 年前

imvain2 3 年前

您的代码为按钮添加了15个事件处理程序。尝试使用一个事件处理程序,递增i,并使用if语句确保i小于15。

var arrColor = ['blue', 'yellow', 'green', 'red', 'blue', 'blue', 'yellow', 'blue', 'blue', 'yellow', 'yellow', 'green', 'green', 'blue', 'yellow'];

let i = 0;

$(document).on("click", ".btn", function() {
  if (i <= 15) {
    if ($(this).attr("id") == arrColor[i]) {
      console.log("great");
    } else {
      console.log("wrong");
    }
    i++;
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="btn" id="blue">B</button>
<button class="btn" id="green">G</button>
<button class="btn" id="yellow">Y</button>
<button class="btn" id="red">R</button>

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

1 年前

Alex · 在轻量级中同时解构和不解构变量

1 年前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

bairog · 从按属性筛选的对象数组字典中创建值数组

1 年前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

1 年前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

user3472810 · Angular@Output/EventEmitter返回undefined

1 年前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

1 年前