0

我有一个图像地图，上面有几个 div 作为城市点。我在 css 中编写了一个类来为这些点的颜色设置动画，所以我可以通过 jQuery 添加该类，等待某个时间并删除该类。目标是随机为这些点设置动画（添加类、等待、随机删除类），但目前我在删除类之前一直在等待。我尝试了不同的解决方案，包括在本网站上发布的解决方案，但没有结果。这里是代码：

        function builtCities() {
            if ($('body.page-service-map').size()) {
                var content = $('#region-content .content'),
                    cityDot = '<div class="city-dot"></div>',
                    cities = [
                        'moscow',
                        'saint-petersburg',
                        'krasnodar',
                        'rostov-na-donu',
                        'tyumen',
                        'omsk',
                        'irkutsk'
                    ];

                for (var i = 0; i < 7; i++) {
                    content.append(cityDot);
                }

                $('body.page-service-map .city-dot').each(function (index) {
                    $(this).addClass(cities[index]);
                });

                // animation
                for (var j = 0; j < cities.length; j++) {                       
                    function partA(partB) {
                        $('.city-dot').eq(j).addClass('animate');
                        window.setTimeout(partB, 1000);
                    } partA(partB);

                    function partB() {
                        $('.city-dot').eq(j).removeClass('animate');
                    }           
                }


            }
        } builtCities();
4

1 回答 1

3

由于关闭，它不起作用。像这样做：

for (var j = 0; j < cities.length; j++) { 
    $('.city-dot').eq(j).addClass('animate');
    window.setTimeout((function (j) {
        return function () {
            $('.city-dot').eq(j).removeClass('animate');
        };
    }(j)), 1000);
}

您当前的变量不起作用，因为您的j变量将被持久化，并且实际上等于cities.length您调用partB. 为了解决这个问题，上面调用了一个传入的函数，j该函数将使用一个单独的变量（参数j）返回另一个函数，该变量将使用正确的索引。

于 2013-04-03T10:22:27.877 回答