如何使用 JQuery 统一访问序号 id 的元素？

Question

我在页面上有几个几乎相同的元素。它们仅在 id 上有所不同 - id="id1", id="id2", ..., id="id10" 我有一个看起来像这样的 JQuery 代码：

$('.element #set1 .select').on('mouseleave', function(){
    if ($('.element #set1 .select .options:visible').length) {
    $('.element #set1 .select .options').slideUp('fast');
    $('.element #set1 .select a.value').addClass('selected').text('1');
}});

...

$('.element #set10 .select').on('mouseleave', function(){
    if ($('.element #set10 .select .options:visible').length) {
    $('.element #set10 .select .options').slideUp('fast');
    $('.element #set10 .select a.value').addClass('selected').text('1');
}});

有没有办法只使用一个统一的代码访问所有不同id的集合？

Answer 1

您可以在事件处理程序中使用当前元素上下文，即 this，它指的是调用事件的元素，并使用各种 DOM 遍历方法，即 .find() 来定位当前元素家属

$('#set1, #set2, ..., #set10 ').on('mouseleave', '.select', function () {
    if ($(this).find('.options:visible').length) {
        $(this).find('.options').slideUp('fast');
        $(this).find('a.value').addClass('selected').text('1');
    }
});

如何使用 JQuery 统一访问序号 id 的元素？

How to unify access to elements with ordinal id using JQuery?

jquery

jquery-events