卡在 JavaScript 添加 Class

Question

    for(i=0;i<document.querySelectorAll(".skill-images").length;i++){

document.querySelectorAll(".skill-images")[i].addEventListener("click", function (){

    document.querySelectorAll(".skill-images")[i].classList.add("imghover");

    setTimeout(function(){
      document.querySelectorAll(".skill-images")[i].classList.remove("imghover");
    },500);
});

}

我哪里错了？ 我只需单击一下即可添加 class imghover。

我的所有图像都有一个 class = "skill-images:

请有人检查并解决它！

Answer 1

您正在绑定一个click事件，该事件在用户单击元素时触发，而不是 hover 。 如果可能的话，对于 hover 状态，最好坚持使用 css 并这样做：

.skill-images:hover {
   // Put here your rules which were defined for .imghover
}

Answer 2

尝试这个

var skillImagesElement = document.querySelectorAll(".skill-images");

    for(var i=0; i<skillImagesElement.length;i++){
        skillImagesElement[i].addEventListener("click", function (e) {
            var eachElement = this;
            eachElement.classList.add("imghover");

            setTimeout(function(){
                eachElement.classList.remove("imghover");
            },500);
        },false);
    }