Сделать значение атрибута alt изображения как значение поля формы

Я хочу добавить значение alt изображения в качестве значения поля формы. Как это сделать с помощью JS или Jquery?

Спасибо

<img src="x.jpg" alt="grab me" id="ok" />

<form action="/#wpcf7-f1352-o1" method="post" class="wpcf7-form init" novalidate="novalidate" data-status="init">
  
<span class="image-alt"><input type="text" name="iamge-alt" value="" size="40"  aria-invalid="false"></span>

<input type="submit" value="OK" class="wpcf7-submit">
</form>
3 метода стилизации элементов HTML
3 метода стилизации элементов HTML
Когда дело доходит до применения какого-либо стиля к нашему HTML, существует три подхода: встроенный, внутренний и внешний. Предпочтительным обычно...
Формы c голосовым вводом в React с помощью Speechly
Формы c голосовым вводом в React с помощью Speechly
Пытались ли вы когда-нибудь заполнить веб-форму в области электронной коммерции, которая требует много кликов и выбора? Вас попросят заполнить дату,...
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Стилизация и валидация html-формы без использования JavaScript (только HTML/CSS)
Будучи разработчиком веб-приложений, легко впасть в заблуждение, считая, что приложение без JavaScript не имеет права на жизнь. Нам становится удобно...
Flatpickr: простой модуль календаря для вашего приложения на React
Flatpickr: простой модуль календаря для вашего приложения на React
Если вы ищете пакет для быстрой интеграции календаря с выбором даты в ваше приложения, то библиотека Flatpickr отлично справится с этой задачей....
В чем разница между Promise и Observable?
В чем разница между Promise и Observable?
Разберитесь в этом вопросе, и вы значительно повысите уровень своей компетенции.
Что такое cURL в PHP? Встроенные функции и пример GET запроса
Что такое cURL в PHP? Встроенные функции и пример GET запроса
Клиент для URL-адресов, cURL, позволяет взаимодействовать с множеством различных серверов по множеству различных протоколов с синтаксисом URL.
1
0
22
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

.getAttribute(), чтобы захватить alt свойство, а затем .forms[0] первый <form> и .elements[0] первый элемент управления формой (<input>) к .value свойству.

const alt = document.querySelector('img').getAttribute('alt');

document.forms[0].elements[0].value = alt;
<img src="x.jpg" alt="grab me" id="ok" />

<form action="/#wpcf7-f1352-o1" method="post" class="wpcf7-form init" novalidate="novalidate" data-status="init">
  
<span class="image-alt"><input type="text" name="iamge-alt" value="" size="40"  aria-invalid="false"></span>

<input type="submit" value="OK" class="wpcf7-submit">
</form>

Другие вопросы по теме