Как узнать id формы через его дочерний input?

Question

[Darth Moul]

Сильно не пинайте, js знаю на уровне «Я сделал калькулятор!»

У меня есть 2 формы в каждой из которых есть input с типом text

<form id="form1">
    <input type="text">
</form>
<form id="form2">
    <input type="text">
</form>

и есть событие change для input'ов которое выводит данные в консоль об объекте к которому я обратился.
В консоли я обнаружил данные о моем объекте, в котором есть строка currentTarget, а в ней строка form указывающая в какой именно форме input был изменен.

$('input[type=text]').change(function(event) {
    console.log(event);
});

Вопрос первый: правильно ли я понимаю, что весь гигантский массив который я лицезрел в консоли содержит моя переменная event.
Вопрос второй: как мне получить значение из строки объекта (требуется строка form).

Answer 1

[Сергей delphinpro]

У объекта event есть свойство target. Там содержится элемент, на котором произошло событие. В вашем случае это HTMLInputElement. У него, в свою очередь есть свойство form, содержащее форму (HTMLFormElement), которой принадлежит поле ввода. А у него, как и у других элементов, присутствует свойство id.
Исходя из вышенаписанного, получить доступ к идентификатору формы можно так:

$('input[type=text]').change(function(event) {
  let id = event.target.form.id;
  console.log(id);
});

Comments

[Darth Moul]

Спасибо за познавательный и развернутый ответ. Я удовлетворил свой интерес.

Answer 2

[WapSter]

А зачем ты вешаешь событие на отдельные инпуты, если можно на форму повесить

Answer 3

[Надим]

Вызывайте parentElement в цикле до тех пор, пока не получите элемент с тегом form.