Question

这是我的代码：

        $(document).ready( function(){

            var current = 0; 
            var numImages = 0;

        var images = new Array();

            $('.smallicon').each(function() {
                numImages++;
            });

            $('.smallicon').each(function() {
                images.push($(this).attr("id"));
            });


            $('.smallicon').click(function() {

                var current = $('.smallicon').index(this);
                alert (current); 
                var theImage = $(this).attr("id");
                var theImagetext = "#focus" + theImage;
                $("#focus"+images[current]).fadeIn();

                //alert( $('.smallicon').index(this) );

                //$('.gallerylightbox').append("Current: " + current + "<br />");
                //$('.gallerylightbox').append("Number: " + numImages + "<br />");


                $("#rightbtnshop").css("display", "block");
                $("#leftbtnshop").css("display", "block");

            if ((current+1) == numImages) {
                $("#rightbtnshop").css("display", "none");
            }

            if (current == 0) {
                $("#leftbtnshop").css("display", "none");
            }   

            }); 

            $('#rightbtnshop').click(function(){
                    moveLeft(); 
            });

            $('#leftbtnshop').click(function(){
                    moveRight();
            });



            function moveLeft()
            {   
            current++; 
                    if (current < numImages) {
                    $('.sliderfocus').css("display", "none");
                    //var theImage = images[current];
                    //var theImagetext = "#big" + theImage;

                    $("#focus"+images[current]).css("display" , "block");

                    //$('.gallerylightbox').append("Current: " + current);
                    //$('#content').append(theImage);

                    $("#rightbtnshop").css("display", "block");
                    $("#leftbtnshop").css("display", "block");

                    if ((current+1) == numImages) {
                        $("#rightbtnshop").css("display", "none");
                    }

                    if (current == 0) {
                        $("#leftbtnshop").css("display", "none");
                    }   
                    }
                    alert(current); 
            }

            function moveRight()
            {
                current--; 
                    if (current <= numImages) {
                    $('.sliderfocus').fadeOut();
                    //var theImage = images[current];
                    //var theImagetext = "#focus" + theImage;

                    $("#focus"+images[current]).fadeIn();

                    //$('.gallerylightbox').append("Current: " + current + "<br />");
                    //$('#content').append(images[current]);

                    $("#rightbtnshop").css("display", "block");
                    $("#leftbtnshop").css("display", "block");

                    if ((current+1) == numImages) {
                        $("#rightbtnshop").css("display", "none");
                    }

                    if (current == 0) {
                        $("#leftbtnshop").css("display", "none");
                    }   
                    }
                    alert(current); 
            }

            var scrolls = 0;

            $("#rightbtnshopmini").click(function() {
                scrolls--;
                scrollnumber = (scrolls * 100);

                $("#smallernav").css("margin-left" , scrollnumber + "%");

                $("#leftbtnshopmini").css("display", "block");

                if (scrolls == 0) {
                    $("#leftbtnshopmini").css("display", "none");
                }else{
                    $("#leftbtnshopmini").css("display", "block");
                }

            });

            $("#leftbtnshopmini").click(function() {
                scrolls++;
                scrollnumber = (scrolls * 100)

                $("#smallernav").css("margin-left" , scrollnumber + "%" );

                if (scrolls == 0) {
                    $("#leftbtnshopmini").css("display", "none");
                }else{
                    $("#leftbtnshopmini").css("display", "block");
                }

            });


            });

我的问题是，点击.smallicon后，尝试点击#leftbtnshop或#rightbtnshop，var值变为0，它显示第一张图片。我确定这是我的功能的范围，但我不知道如何纠正这一点。 http://bandsofyeg.com/shop/

的工作版本

Answer 1

问题出在这里，你在这段代码中重新定义了current的本地版本。删除var（应该只是current = $('.smallicon').index(this);），这应该可以解决您的问题。

$('.smallicon').click(function () { var current = $('.smallicon').index(this); alert(current); var theImage = $(this).attr("id");

在触发其他功能后，Var默认为0

1 个答案: