Как в скрипте указать class с любой цифрой на конце?

Question

Александр @Shura0102

JavaScript

Как в скрипте указать class с любой цифрой на конце?

Как указать class с любой цифрой на конце или их перечислить?

$(document).on('click', function(e) {
  if (!$(e.target).closest(".filter").length) {
    $('.filter-block').hide(); 
  }
  e.stopPropagation();
});

в данном скрипте мне нужно указать class filter-block с любой цифрой на конце или их перечислить. Т.е нужно чтобы он взаимодействовал с filter-block, filter-block2, filter-block3, filter-block4, filter-block5 и т.д

Вопрос задан более года назад
100 просмотров

3 комментария

Подписаться 1 Простой 3 комментария

Lynn «Кофеман» @Lynn

https://doka.guide/css/attribute-selector/

[class^=filter-block]

Написано более года назад
Ivan Ustûžanin @IvanU7n

или прямо так и перечислить через запятую: https://doka.guide/css/selector-list/

Написано более года назад

Александр @Shura0102 Автор вопроса

Я наверное не правильно изъяснился, мне нужно что бы получилось так

$(document).on('click', function(e) {
  if (!$(e.target).closest(".filter").length) {
    $('.filter-block').hide(); 
  }
  e.stopPropagation();
});

$(document).on('click', function(e) {
  if (!$(e.target).closest(".filter2").length) {
    $('.filter-block2').hide(); 
  }
  e.stopPropagation();
});

$(document).on('click', function(e) {
  if (!$(e.target).closest(".filter3").length) {
    $('.filter-block3').hide(); 
  }
  e.stopPropagation();
});

$(document).on('click', function(e) {
  if (!$(e.target).closest(".filter4").length) {
    $('.filter-block4').hide(); 
  }
  e.stopPropagation();
});

$(document).on('click', function(e) {
  if (!$(e.target).closest(".filter5").length) {
    $('.filter-block5').hide(); 
  }
  e.stopPropagation();
});

этот код конечно не правельный, но смысл такой. Каждый class .filter{0-9] должен взаимодействовать с .filter-block{0-9]

Написано более года назад

https://doka.guide/css/attribute-selector/

[class^=filter-block]
или прямо так и перечислить через запятую: https://doka.guide/css/selector-list/
Я наверное не правильно изъяснился, мне нужно что бы получилось так

$(document).on('click', function(e) { if (!$(e.target).closest(".filter").length) { $('.filter-block').hide(); } e.stopPropagation(); }); $(document).on('click', function(e) { if (!$(e.target).closest(".filter2").length) { $('.filter-block2').hide(); } e.stopPropagation(); }); $(document).on('click', function(e) { if (!$(e.target).closest(".filter3").length) { $('.filter-block3').hide(); } e.stopPropagation(); }); $(document).on('click', function(e) { if (!$(e.target).closest(".filter4").length) { $('.filter-block4').hide(); } e.stopPropagation(); }); $(document).on('click', function(e) { if (!$(e.target).closest(".filter5").length) { $('.filter-block5').hide(); } e.stopPropagation(); });

этот код конечно не правельный, но смысл такой. Каждый class .filter{0-9] должен взаимодействовать с .filter-block{0-9]

Answer 1 · 2024-02-23 11:20:56

Правильнее будет изменить принцип, а не подстраиваться. Я так понимаю, нужно закрыть все блоки, кроме того, по которому кликнули?

<div class="filter" data-id="1">
<div class="filter-block" data-target="1">

<div class="filter" data-id="2">
<div class="filter-block" data-target="2">

<div class="filter" data-id="3">
<div class="filter-block" data-target="3">

$(document).on('click', function(e) {
  let $f = $(e.target).closest(".filter");
  if ($f.length) {
    let id = $f.data('id');
    $('.filter-block:not([data-target="'+id+'"])').hide(); 
  }
  e.stopPropagation();
});

Как в скрипте указать class с любой цифрой на конце?

Войдите на сайт