Question

我的页面上有以下代码，在pagereload之后它可以正常工作，但是如果没有重新加载，这个脚本将无法正常工作。

第一次使用：效果很好
第二次使用：为什么跳过1级？第3次使用：跳过2个班级

如何在没有页面重新加载的情况下刷新脚本或者我需要做什么？

$(document).ready(function(){  

 $('.partImg').each(function(){
        $(this).click(function(){
            $("#hideMod, #visMod, #nextP, #closeP, #prevP").fadeIn(400);
            $(this).next().addClass("ASert");
            var AV = $(".ASert").text();
            $('#visMod').html("<img src='" + AV + "'/>");

            $("#nextP").click(function(){
                if ($('.hidePart:last').hasClass("ASert") ) {
                    $('.hidePart:first').addClass("ASert");
                    $('.ASert').last().removeClass("ASert");
                } else {        
                    $('.ASert').next().next().addClass("ASert");
                    $('.ASert').first().removeClass("ASert");
                }
                var AV = $(".ASert").text();
                $('#visMod').html("<img src='" + AV + "'/>");
            });

            $("#prevP").click(function(){
                if ($('.hidePart:first').hasClass("ASert") ) {
                    $('.hidePart:last').addClass("ASert");
                    $('.ASert').first().removeClass("ASert");        
                } else {        
                    $('.ASert').prev().prev().addClass("ASert");
                    $('.ASert').last().removeClass("ASert");        
                }
                var AV = $(".ASert").text();
                $('#visMod').html("<img src='" + AV + "'/>");
            });        

            $("#closeP").click(function(){
                $("#hideMod, #visMod, #nextP, #closeP, #prevP").fadeOut(200);
                $(".ASert").removeClass("ASert");
            });
       });
    });
});

http://istyle.kz/test/index.php?id=32在这里您可以查看问题所在。

点击任意图片并尝试上一个/下一个
关闭灯箱
再次点击图片并尝试上一个/下一个

Answer 1

这是javascript的常见问题。在内部单击处理程序中，您绑定另一个单击处如果有必要，应该在某处进行解除绑定。

但是，它似乎没有必要。所以，我建议用这种方式重构代码：

$(function(){
    $("#nextP").on("click", function(){
        //...
    });
    $("#prevP").on("click", function(){
        //...
    });
    $("#closeP").on("click", function(){
        //...
    });
    $('.partImg').on( "click", function(){
        $("#hideMod, #visMod, #nextP, #closeP, #prevP").fadeIn(400);
        //...
    });
});

希望这有帮助。

奇怪的Javascript行为

1 个答案: