我想通过使用 java 脚本或 jquery 动态查找特定名称数组的索引

Question

我的示例代码<div class="my_class_1">    <input type="text" name="name_1[]" value="1" />    <input type="text" name="name_1[]" value="2" /></div><div class="my_class_2">    <input type="text" name="name_1[]" value="3" />    <input type="text" name="name_1[]" value="4" /></div><div class="my_class_3">    <input type="text" name="name_1[]" value="5" />    <input type="text" name="name_1[]" value="6" /></div>这里带有 name_1 的文本框将在任何 div my_class_1/my_class_2/my_class_3 中动态添加，同时添加新的输入类型我想获取以前的值并添加到新的文本框例如，如果我为 div 类 my_class_1 添加新文本框，则新文本框值应该像这样成为2<input type="text" name="name_1[]" value="2" />当我为 div class my_class_2 添加新文本框时，新文本框值应该是 4 像这样<input type="text" name="name_1[]" value="4" />我在javascript中尝试了一些方法<script>let lastElement = document.getElementsByName("name_1[]");let leng1 = lastElement.length;lastValue = (typeof lastElement[lastElement-1] == 'undefined') ?  0 : lastElement[lastElement - 1].value;</script>这总是返回我最后一个值任何人都可以帮助我提前谢谢你

Answer 1

您可以使用document.querySelector()CSS 选择器选择单个元素。因此，您可以做的是选择要在其中选择输入的容器，并使用:last-of-type伪选择器选择具有您正在搜索的条件的最后一个输入。这允许始终选择正确位置的最后一个输入。

let lastElement = document.querySelector('.my_class_2 input[name="name_1[]"]:last-of-type');

let lastValue = lastElement.value;

console.log(lastElement, lastValue);

<div class="my_class_1">

    <input type="text" name="name_1[]" value="1" />

    <input type="text" name="name_1[]" value="2" />

</div>

<div class="my_class_2">

    <input type="text" name="name_1[]" value="3" />

    <input type="text" name="name_1[]" value="4" />

</div>

<div class="my_class_3">

    <input type="text" name="name_1[]" value="5" />

    <input type="text" name="name_1[]" value="6" />

</div>