javascript - Jquery 删除类并没有真正删除它

Question

var newLevel = function(level){
setTimeout(function(){
var time=2;
for(var i=1;i<level+1;i++){
    var box = parseInt(Math.random()*25+1)
    if($("#box"+box).hasClass("g3")){
        i--
    }else{
    $("#box"+box).removeClass();
    $("#box"+box).addClass("g3");
    }
}
setTimeout(function(){
        $(".g3").addClass("g2");
        $(".g3").removeClass("g3");
        var right = 0;
        var toGet = level
        $(".g2").click(function(){
            $(this).removeClass("g2");
            $(this).addClass("g3");
            right++
            if(right==toGet){
                level++;
                gameBoard(level)
                newLevel(level);
            }
        })
    },time*1000);
},2800);

}   

所以我像往常一样制作游戏，但我像往常一样遇到了问题。我认为发生的错误来自于.g2被点击时的“click”事件，visible .g2 class 被删除，并且 th .g3 class 变为 visible 。但在此事件之后，您可以重新单击相同的div(之前有.g2，现在可见 具有 .g3)并具有相同的影响(right++)，所以看起来 .g2 尚未真正被删除？不管怎样，我们希望得到一些帮助，干杯。

Answer 1

jQuery 的点击函数中的查询不是实时的，一旦附加了事件处理程序，如果 DOM 元素发生更改(在您删除类时的情况下)，它就不会被删除。想象一下，为 N 个元素注册一个带有类的点击处理程序，然后从其中一半元素中删除该类。所有这些仍将处理该事件，因为已附加点击处理程序。

您应该使用one()函数而不是click():

$(".g2").one("click", (function() {

它之所以有效，是因为您注册了一个点击处理程序，然后删除了类(并且您不再需要点击处理程序)。这就是 one() 的作用，事件处理程序仅执行一次(因此您不需要为此进行任何实时查询)。