Как применить изменения только к новым полям после события "добавить новое"?

#javascript #wordpress #input #jquery-selectors

#javascript #wordpress #ввод #jquery-селекторы

Вопрос:

У меня есть фрагмент кода, который автоматически заполняет новые поля определенным числом. Однако это автоматически также обновляет значения перед редактированием пользователем. Мне нужно настроить этот код так, чтобы только вновь добавленные строки включали желаемый предварительно заполненный номер без редактирования каких-либо других.

 document.addEventListener("DOMContentLoaded", function(event) {
  copyValueToRepeat();

  var sourceField = document.getElementById( 'field_jimvh' );
  sourceField.addEventListener( "change", function(event) {
  copyValueToRepeat();
  });

});

jQuery(document).on('frmAfterAddRow', copyValueToRepeat );

function copyValueToRepeat(){
  var sourceField = document.getElementById( 'field_jimvh' );
  var repeatFields = document.querySelectorAll( '.frm_field_216_container input');

 for ( var i = 0, len=repeatFields.length; i<len; i   ) {
        repeatFields[i].value = sourceField.value;
    }   

}

Я считаю, что проблема в цикле for в конце, но я не знаю, как ее точно настроить. Я предполагаю, что эта проблема будет тривиальной, но мои навыки программирования являются базовыми.

Спасибо за вашу помощь.

1. Эта строка «var repeatFields = document. querySelectorAll(‘.frm_field_216_container input’);» выбирает все поля, имеющие указанный класс, который, по-видимому, включает все ваши поля, включая старые. Вы можете попробовать добавить другой класс в новое поле и выбрать его использование, если это возможно.

2. К сожалению, это невозможно, так как я работаю с плагином WordPress. Однако значение x в name увеличивается на 1 каждый раз ( item_meta[201][x][216] ). Могу ли я обойти этот путь? Применение скрипта только к «более высоким» числам?

3. Я не уверен, как это можно сделать надежным способом. Может быть, кто-то с лучшими знаниями в WordPress может помочь. Вы должны добавить эти детали к вопросу.

Ответ №1:

В этой строке document.querySelectorAll( '.frm_field_216_container input') выбираются все поля. Возможно, вы захотите добавить дополнительный класс css в новые поля, например ‘new_input_field’, а затем изменить свой селектор запросов на: document.querySelectorAll( '.frm_field_216_container .new_input_field')