0

主题：滚筒德比。我有8支球队，每支球队有4名球员。我将在网格中的页面上显示团队。8 支球队被 4 名球员淘汰。当您翻转任何一名球员时，同一支球队的所有球员都会亮起。

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

XXXXXXXXX
XXXXXXXXX
XXXXXXXXX
XXXXXXXXX

每个玩家都是一个 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');
        });
    }
});

提前致谢。

4

1 回答 1

0

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

见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));
    }
});
于 2012-10-03T03:54:54.307 回答