Как сделать добавление класса не по каждому объекту а по какому нибудь индикатору?

Question

[Shuboanator]

<div class="name">
     <div class="1">1</div>
     <div class="2">2</div>
</div>
<div class="bloc">
     <div class="1-bloc">1</div>
     <div class="2-bloc">2</div>
</div>

$('.1, .1-bloc').hover(function () {
    $(''.1, .1-bloc'').toggleClass("active");
});
$('.2, .2-bloc').hover(function () {
    $(''.2, .2-bloc'').toggleClass("active");
});

Как сделать что бы не вести отдельный код по каждому элементу, а сделать общий?

Comments

[edward_freedom]

$('.*, .*-bloc').hover(function () {
    $(this).toggleClass("active");
});

попробуй так

[Shuboanator]

edward_freedom, так будет добавляться к каждому классу который укажу вместо *(звездочки)
а мне надо, что бы добавлялась именно к определенным парам элементов

[edward_freedom]

Shuboanator, а кто класс называет одной буквой или цифрой то?

[Shuboanator]

edward_freedom,

<div class="name">
     <div class="1" data-toggle=1>1</div>
     <div class="2" data-toggle=2>2</div>
</div>
<div class="bloc">
     <div class="1-bloc" data-toggle=1>1</div>
     <div class="2-bloc" data-toggle=2>2</div>
</div>

$('[data-toggle]').hover(function (e){
  $(this).toggleClass("active");
});

Только как вот сделать, что бы класс добавлялся по индикатору 1 или 2?

Answer 1

[betterthanyouthink]

Я бы посоветовал вам накинуть на каждый элемент data аттрибут, либо класс.

<div class="name">
     <div class="1" data-toggle>1</div>
     <div class="2" data-toggle>2</div>
</div>
<div class="bloc">
     <div class="1-bloc" data-toggle>1</div>
     <div class="2-bloc" data-toggle>2</div>
</div>

$('[data-toggle]').hover(function (e){
  $(this).toggleClass("active");
});

Comments

[Shuboanator]

Вот а как сделать этоже, но что бы у элементов 1 и 2 были разные Data-toggle?

[Shuboanator]

<div class="name">
     <div class="1" data-toggle=1>1</div>
     <div class="2" data-toggle=2>2</div>
</div>
<div class="bloc">
     <div class="1-bloc" data-toggle=1>1</div>
     <div class="2-bloc" data-toggle=2>2</div>
</div>

$('[data-toggle]').hover(function (e){
  $(this).toggleClass("active");
});

Только как вот сделать, что бы класс добавлялся по индикатору 1 или 2?

[betterthanyouthink]

честно, не совсем понимаю что вы хотите сделать. вам необходимо, чтобы при наведении на элемент с data-toggle=1, класс навешивался на него и на другой элемент с таким же значением атрибута? если да, то попробуйте так:

$('[data-toggle]').hover(function (e) {
  const value = $(this).data('toggle');
  $(`[data-toggle=${value}]`).toggleClass("active");
});

[Shuboanator]

betterthanyouthink, Cпасибо большое) Помогло)