如何获取 class 中的所有字段

Question

我有多个 class 里面有不同数量的字段，1 class 例子：

<div class="row form-row-extra-phone spacer">
        <div class="col-12">
            <div class="input-group">
                <input type="tel" name="extraPhone-0-phone_number" class="form-control" placeholder="Extra Phone Number" maxlength="128" id="id_extraPhone-0-phone_number">
                <div class="input-group-append">
                     <a class="btn btn-success btn-circle btn-sm add-form-row" href="#" role="button" id="plus_payment_data">+</a>
                </div>
            </div>
        </div>
</div>

我想遍历 class 中具有属性 "name" 和 "id" 的所有字段，并将其中的数字加 1（在示例 name="extraPhone-0-phone_number" -> name="extraPhone-1-phone_number")

我可以通过以下方式 select class： $('.form-row-extra-phone')

我如何迭代里面所有包含属性'name'和'id'的字段？

Answer 1

当你说到 class 时，我假设你指的是 <div class="row form-row-extra-phone spacer">？这是 element，而不是 class。

Class 可能是一个有问题的术语，因为它可以指代 CSS/DOM classes or Javascript classes，完全不相关。

所以如果你有 <div class="something"> 那么 something 是 CSS/DOM class，但整个事情 而不是 class 但 element 具有 class.

现在你所指的fields也只是elements。

因此，您想要的是 select 所有具有 class form-row-extra-phone 的元素以及所有具有 name 属性的后代元素。这很容易。基本上在 CSS selector </code> (space) 是 selector for descendant elements.</p> <p>所以你可以 select <code>.form-row-extra-phone [name].

所以你可能想要的是这样的：

document.querySelectorAll('.form-row-extra-phone [name]')
  .forEach(elem => elem.name.replace(/[0-9]/, x => Number(x) + 1));

Answer 2

当您使用 ^= 时表示开始于，而 $= 表示结束于.

如果条件是（名称和 ID）

    $('.form-row-extra-phone input[name^="extraPhone"][id^="id_extraPhone"]')

如果条件是（名称或 ID）

    $('.form-row-extra-phone input[name^="extraPhone"],input[id^="id_extraPhone"]')

检查此 https://api.jquery.com/multiple-attribute-selector/ 或 google "jQuery Multiple attributes selector"

如何获取 class 中的所有字段

How to get all fields in class

javascript

jquery

formset