从getElementsByClassName中得到括号之间的类名编号

Question

在我的示例中，我想知道被单击的类名具有哪个数字（在方括号之间）。写入另一个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”的方括号中给出，但这似乎效率不高。

Answer 1

从单击的元素中，您可以导航到其.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()。