Как настроить таргетинг на последний видимый элемент с помощью jquery

Question

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

То, что я пытаюсь сделать, это выбрать все входные данные, которые в настоящее время видимы, а затем специально нацелиться на последний (самый последний показанный).

Проблема заключается в том, что он нацелен на последнего дочернего элемента каждого элемента .form, а не непосредственно на последний элемент формы.

$(".webform").on("change", function() {
  $(".form-item:visible").each(function() {
    if ($(this).is(":last-of-type")) {
      //Do whatever
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="webform">
  <div class="form-item" style="display:block">
  </div>
  <div class="form-item" style="display:block">
  </div>
  <div class="form-item" style="display:block">
  </div>
  <div class="form-item" style="display:none">
  </div>
</div>

Answer 1

Вы можете применить приведенный ниже код при изменении поля формы или при отправке формы, в зависимости от ваших требований.

<div class="webform">
    <div class="form-item" style="display:block">
        <input type="text" value="1" />
    </div>
    <div class="form-item" style="display:block">
        <input type="text" value="2" />
    </div>
    <div class="form-item" style="display:block">
        <input type="text" value="3" />
    </div>
    <div class="form-item" style="display:none">
        <input type="text" value="4" />
    </div>
</div>

<script>alert($(".form-item:visible:last input").val());</script>

Answer 2

Вы можете упростить свой поток, используя этот jQuery: последний селектор

$('.form-item:visible:last')