Question

主题：轮滑德比。我有8支球队，每支球队有4名球员。我将在网格中的页面上显示团队。 8名队员由4名队员组成。当您翻转任何玩家时，同一团队中的所有玩家都会亮起。

看起来像这样......

X X X X X X X X
X X X X X X X X
X X X X X X X X
X X X X X X X X

每个玩家都是div，每个团队都有一个类（“team1”“team2”“team3”......）。我如何遍历每个团队并嵌套循环每个玩家添加一个函数来改变团队类属性？

这就是我目前所拥有的（这是有效的，但只适用于“team1”）......

$(document).ready(function() {
        $('.team1').mouseenter(function(){
            $('.team1').css('background-color', '#f79a00');
            $('.defaultTeam').css('background-color', '#8c2559');
        });

        $('.team1').mouseleave(function(){
            $('.team1').css('background-color', '#8c2559');
            $('.defaultTeam').css('background-color', '#f79a00');
        });
});

我可以对每个团队进行硬编码，但如果我有100个团队呢？这就是我拍摄的（目前还没有工作）......

$(document).ready(function() {
    for (var t=0;t<9;t++){
        $('.team'+t).mouseenter(function(){
            $('.team'+t).css('background-color', '#f79a00');
            $('.defaultTeam').css('background-color', '#8c2559');
        });

        $('.team'+t).mouseleave(function(){
            $('.team'+t).css('background-color', '#8c2559');
            $('.defaultTeam').css('background-color', '#f79a00');
        });
    }
});

提前致谢。

Answer 1

问题是在定义mouseenter / leave处理程序中的匿名函数时执行函数时t的值不相同。

请参阅http://www.javascriptkit.com/javatutors/closures.shtml

$(document).ready(function() {
    function me(t){
        return function(){
            $('.team'+t).css('background-color', '#f79a00');
            $('.defaultTeam').css('background-color', '#8c2559');
        }
    }
    function ml(t){
        return function(){
            $('.team'+t).css('background-color', '#8c2559');
            $('.defaultTeam').css('background-color', '#f79a00');
        }
    }
    for (var t=0;t<20;t++){
        $('.team'+t).mouseenter(me(t));     
        $('.team'+t).mouseleave(ml(t));
    }
});

jquery - 在for循环中放置一个.each（）循环？

1 个答案: