Найти все элементы на основе идентификаторов с помощью регулярных выражений на селекторе jQuery - PullRequest
Новая
       29

Найти все элементы на основе идентификаторов с помощью регулярных выражений на селекторе jQuery

24 голосов
/ 21 июня 2010

У меня есть несколько элементов с уникальными идентификаторами, например, так: 

<div id='item-1-top'></div>
<div id='item-2-top'></div>
<div id='item-3-top'></div>

Я надеялся, что следующее будет работать с использованием jQuery: 

$("#item-[.]+-top").each(function() {
  $(this).hide();
});

У меня нет хорошегопонимание регулярных выражений, и я был бы признателен за некоторую информацию, так как приведенное выше неверно.

Ответы [ 5 ]

38 голосов
/ 21 июня 2010

Если бы вы делали это с регулярным выражением, выражение было бы просто: 

item-\d-top

Где \d обозначает любую одну цифру (0..9), а другие символы не имеют специального значения (поэтому рассматриваются как литералы).

Тем не менее, в jQuery в настоящее время нет фильтра регулярных выражений (только такие вещи, как start / end / содержит / etc) - поэтому вам придется создать свой собственный (что возможно, но если вы считаете, что вам следует прекратить и подумайте, что / почему вы фильтруете, и выясните, есть ли лучший способ сначала).

Намного проще было бы создать класс (как подсказывает serg555 ) , поскольку именно так вы относитесь к этим элементам.

Или (если вы не можете изменить разметку для добавления класса), затем используйте существующие фильтры, расширяя ответ g.d.d.c , я мог бы сделать: 

$('div[id^=item-][id$=-top]').hide()

(Поскольку у вас может быть несколько элементов, оканчивающихся на 'top', либо сейчас, либо в будущем, вам нужно быть более конкретным, чтобы избежать непреднамеренного сокрытия других вещей.)

13 голосов
/ 30 июня 2010

Если бы идентификатор был что-то вроде news-top-1, news-top-2, news-top-3, news-top-4 и т. Д., То селекторы помогли бы вам.

http://api.jquery.com/attribute-starts-with-selector/

$.each( $("input[name^='news-top-']"), function () {
  alert( $(this).hide() );
});
8 голосов
/ 21 июня 2010

Я бы назначил им некоторый класс, например item, а затем выполнил бы поиск по этому классу $(".item").

4 голосов
/ 26 февраля 2015

Джеймс Падолси создал замечательный фильтр , который позволяет использовать регулярные выражения для выбора. 

jQuery.expr[':'].regex = function(elem, index, match) {
    var matchParams = match[3].split(','),
        validLabels = /^(data|css):/,
        attr = {
            method: matchParams[0].match(validLabels) ? 
                        matchParams[0].split(':')[0] : 'attr',
            property: matchParams.shift().replace(validLabels,'')
        },
        regexFlags = 'ig',
        regex = new RegExp(matchParams.join('').replace(/^s+|s+$/g,''), regexFlags);
    return regex.test(jQuery(elem)[attr.method](attr.property));
}

Теперь вы можете использовать 

$('div:regex(id,item-[0-9]-top)').hide()
0 голосов
/ 28 февраля 2017

Ударил аналогичную проблему и понравился ответ Сергея о создании класса вместо этого, но тогда, когда я делал несколько операций над такими элементами, Коллекции ключей были более подходящими.

...