Javascript 如何组合这些悬停功能

我有很多跨度，我需要在悬停后分组以更改不透明度，所有这些跨度都需要有唯一的ID，有没有办法将所有悬停函数合并为一个函数

jQuery

//09    
    $('#c_09_241a, #c_09_241b, #c_09_241c, #c_09_241d').hover(
        function() {
            $('#c_09_241a, #c_09_241b, #c_09_241c, #c_09_241d').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_09_241a, #c_09_241b, #c_09_241c, #c_09_241d').stop(true, true).css('opacity','0');
    }); 
    $('#c_09_242a, #c_09_242b').hover(
        function() {
            $('#c_09_242a, #c_09_242b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_09_242a, #c_09_242b').stop(true, true).css('opacity','0');
    });
    $('#c_09_245a, #c_09_245b').hover(
        function() {
            $('#c_09_245a, #c_09_245b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_09_245a, #c_09_245b').stop(true, true).css('opacity','0');
    });
    $('#c_09_246a, #c_09_246b').hover(
        function() {
            $('#c_09_246a, #c_09_246b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_09_246a, #c_09_246b').stop(true, true).css('opacity','0');
    });

    //08    
    $('#c_08_235a, #c_08_235b, #c_08_235c, #c_08_235d').hover(
        function() {
            $('#c_08_235a, #c_08_235b, #c_08_235c, #c_08_235d').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_08_235a, #c_08_235b, #c_08_235c, #c_08_235d').stop(true, true).css('opacity','0');
    }); 
    $('#c_08_236a, #c_08_236b').hover(
        function() {
            $('#c_08_236a, #c_08_236b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_08_236a, #c_08_236b').stop(true, true).css('opacity','0');
    });
    $('#c_08_239a, #c_08_239b').hover(
        function() {
            $('#c_08_239a, #c_08_239b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_08_239a, #c_08_239b').stop(true, true).css('opacity','0');
    });
    $('#c_08_240a, #c_08_240b').hover(
        function() {
            $('#c_08_240a, #c_08_240b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_08_240a, #c_08_240b').stop(true, true).css('opacity','0');
    });

    //07    
    $('#c_07_227a, #c_07_227b').hover(
        function() {
            $('#c_07_227a, #c_07_227b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_07_227a, #c_07_227b').stop(true, true).css('opacity','0');
    });
    $('#c_07_228a, #c_07_228b, #c_07_228c').hover(
        function() {
            $('#c_07_228a, #c_07_228b, #c_07_228c').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_07_228a, #c_07_228b, #c_07_228c').stop(true, true).css('opacity','0');
    });
    $('#c_07_007a, #c_07_007b').hover(
        function() {
            $('#c_07_007a, #c_07_007b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_07_007a, #c_07_007b').stop(true, true).css('opacity','0');
    });
    $('#c_07_008a, #c_07_008b').hover(
        function() {
            $('#c_07_008a, #c_07_008b').stop(true, true).css('opacity','1');
        },
        function() {
             $('#c_07_008a, #c_07_008b').stop(true, true).css('opacity','0');
    });

HTML

---

您可以在大多数jQuery事件处理程序中使用

这个

，它包含触发事件的元素。尝试以下方法：

$('.rzuty>span').hover(function() {
    $(this).stop(true, true).css('opacity',1);
}, function() {
    $(this).stop(true, true).css('opacity',0);
});

---

或者，如果您想更具体一些，可以添加一个类并在选择器中使用它。

您可以在大多数带有触发事件的元素的jQuery事件处理程序中使用

this

。尝试以下方法：

$('.rzuty>span').hover(function() {
    $(this).stop(true, true).css('opacity',1);
}, function() {
    $(this).stop(true, true).css('opacity',0);
});

---

或者，如果您想更具体一些，请添加一个类并在选择器中使用它。

您有三个选项：

将类用作选择器：

$('.mieszkanie').hover(
    function() {
        $(this).stop(true, true).css('opacity','1');
    },
    function() {
        $(this).stop(true, true).css('opacity','0');
});

在同一选择器中添加所有ID：

$('#c_09_245a, #c_09_245b, #c_09_246a, #c_09_246b, #c_09_247a, #c_09_247b').hover(
    function() {
        $(this).stop(true, true).css('opacity','1');
    },
    function() {
        $(this).stop(true, true).css('opacity','0');
});

制作两个函数，完成减少代码所需的操作：

function show () {
    $(this).stop(true, true).css('opacity','1');
}

function hide () {
    $(this).stop(true, true).css('opacity','0');
}

$(selector).hover(show, hide);

---

您有三种选择：

将类用作选择器：

$('.mieszkanie').hover(
    function() {
        $(this).stop(true, true).css('opacity','1');
    },
    function() {
        $(this).stop(true, true).css('opacity','0');
});

在同一选择器中添加所有ID：

$('#c_09_245a, #c_09_245b, #c_09_246a, #c_09_246b, #c_09_247a, #c_09_247b').hover(
    function() {
        $(this).stop(true, true).css('opacity','1');
    },
    function() {
        $(this).stop(true, true).css('opacity','0');
});

制作两个函数，完成减少代码所需的操作：

function show () {
    $(this).stop(true, true).css('opacity','1');
}

function hide () {
    $(this).stop(true, true).css('opacity','0');
}

$(selector).hover(show, hide);

---

谢谢马特，我们有最后的答案

var ids = [
    "#c_07_227a, #c_07_227b",
    "#c_07_228a, #c_07_228b, #c_07_228c"
    // add more here
];

ids.forEach(function(i) {
    $(i).hover(function() {
        $(i).stop(true, true).css('opacity', '1');
    }, function() {
        $(i).stop(true, true).css('opacity', '0');
    });
});

---

谢谢马特，我们有最后的答案

var ids = [
    "#c_07_227a, #c_07_227b",
    "#c_07_228a, #c_07_228b, #c_07_228c"
    // add more here
];

ids.forEach(function(i) {
    $(i).hover(function() {
        $(i).stop(true, true).css('opacity', '1');
    }, function() {
        $(i).stop(true, true).css('opacity', '0');
    });
});

---

向需要相同效果的

span

s添加一个通用类，并使用该类制作jQuery Selector？$（“.rzuty>span”）。每个（…）？向需要相同效果的

span

s添加一个通用类，并使用该类制作jQuery Selector？$（“.rzuty>span”）。每个（…）@Robert K，谢谢，我不知道。我已经在努力格式化：）。没问题；我看了一下文档，看看这是否可行，瞧……）@罗伯特K，谢谢，我不知道。我已经在努力格式化：）。没问题；我看了一下文档，看看这是否可行，瞧……）