Как получить все поля в классе - PullRequest
Новая
       26

Как получить все поля в классе

0 голосов
/ 10 ноября 2019

У меня есть несколько классов с разным количеством полей внутри, 1 пример класса: 

<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>

Я хочу перебрать все поля внутри классов, которые имеют атрибуты "name" и "id"и добавьте 1 к числу внутри (в примере name="extraPhone-0-phone_number" -> name="extraPhone-1-phone_number")

Я могу выбрать класс с помощью: $('.form-row-extra-phone')

Как я могу выполнить итерацию на всехfileds внутри это содержит атрибуты 'name' и 'id'?

Ответы [ 2 ]

2 голосов
/ 10 ноября 2019

Полагаю, вы имеете в виду <div class="row form-row-extra-phone spacer">, когда говорите о class? Это element, а не класс.

Класс может быть проблематичным, поскольку он может ссылаться на классы CSS / DOM или классы Javascript, которые совершенно не связаны.

Так что, если у вас есть <div class="something">, тогда something является классом CSS / DOM, но все это не этот класс, а element с этим классом.

Теперь то, на что вы ссылаетесь fields, также просто element с.

Итак, вы хотите выбрать все элементы, имеющие класс form-row-extra-phone, и ихвсе дочерние элементы с атрибутом name. И это довольно просто. В основном в селекторе CSS (пробел) является селектором для элементов-потомков.

Таким образом, вы можете выбрать .form-row-extra-phone [name].

Так что вы, вероятно, хотите что-то вроде этого: 

document.querySelectorAll('.form-row-extra-phone [name]')
  .forEach(elem => elem.name.replace(/[0-9]/, x => Number(x) + 1));
0 голосов
/ 10 ноября 2019

Когда вы используете ^=, это означает, что начинается с, а $= означает, что заканчивается на.

Если условие (имя И 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 attribute selector"

...