Передать текст с input:focus placeholder в div

Есть HTML разметка:

<div class="form">
    <div class="item">
        <span class="label"></span>
        <input type="text" placeholder="Имя">
    </div>

    <div class="item">
        <span class="label"></span>
        <input type="text" placeholder="Фамилия">
    </div>
</div>

Вопрос: Как с помощью Jquery при клике по input передать текст с placeholder в div label?

Прошу помощи в реализации.


Ответы (1 шт):

Автор решения: soledar10

Пример с использованием js

document.querySelectorAll('.form .item').forEach(item => {
  const input = item.querySelector('input');
  const label = item.querySelector('.label');

  input.addEventListener('focus', () => {
    label.textContent = input.placeholder;
  });
  
  // при потере фокуса - текст будет исчезать
  input.addEventListener('blur', () => {
    label.textContent = '';
  });
});
<div class="form">
  <div class="item">
    <span class="label"></span>
    <input type="text" placeholder="Имя">
  </div>

  <div class="item">
    <span class="label"></span>
    <input type="text" placeholder="Фамилия">
  </div>
</div>

→ Ссылка