Получить номер класса в скобках из getElementsByClassName - PullRequest
Новая
       19

Получить номер класса в скобках из getElementsByClassName

0 голосов
/ 15 апреля 2020

В моем примере я хочу знать, на каком номере (между квадратными скобками) было выбрано имя класса. Это необходимо для записи в тот же номер класса другого div. 

<div class="button_minus"></div>
<div class="input_test"></div>
<div class="button_minus"></div>
<div class="input_test"></div>
<div class="button_minus"></div>
<div class="input_test"></div>


$(".button_minus").click(function(){
            document.getElementsByClassname("input_test").[???].value = "test";
});

Существует возможность задать каждому «button_minus» параметр значения, который может быть задан в квадратных скобках «input_test», но который кажется неэффективным.

1 Ответ

0 голосов
/ 15 апреля 2020

От элемента, по которому щелкнули, вы можете перейти к его элементу .next(), чтобы перейти к связанному input_test div: 

$(".button_minus").click(function(){
  $(this).next().text('test');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="button_minus">-</div>
<div class="input_test">input</div>
<div class="button_minus">-</div>
<div class="input_test">input</div>
<div class="button_minus">-</div>
<div class="input_test">input</div>

Обратите внимание, что поскольку элемент является <div>, а не полем, подобным вводу, не используйте .value (или .val()) - используйте textContent или .text().

Если вам также нужен индекс, проверьте его индекс в коллекции: 

const minuses = $(".button_minus");
minuses.click(function(){
  $(this).next().text('test');
  console.log(minuses.index(this));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="button_minus">-</div>
<div class="input_test">input</div>
<div class="button_minus">-</div>
<div class="input_test">input</div>
<div class="button_minus">-</div>
<div class="input_test">input</div>
...