aliasmark
@aliasmark

Как добавить строку в текстовый инпут из коллекции элементов или массива по событию?

Задача - передать значение/имя/текст заголовка h1 в текстовый input после события клик мыши на button.
h1 по отношению к button не родительский, не соседний и т.д., чтобы можно было выбрать каким-либо методом.

let indexToHeaderList;
let headerList = document.querySelectorAll(".mainTm > div:nth-child(2) > div:nth-child(2) > h1"); // nodelist заголовков h1
let headerArr = Array.from(headerList); // преобразуем в массив
let knopokList = document.querySelectorAll(".mainTm > div:nth-child(2) > div:nth-child(4) > div:nth-child(2) > button.modalWindow"); // nodelist кнопок при клике на которые будет подхватываться заголовок h1
	knopokList.forEach(elem => elem.addEventListener('click', addValueToInput));
let inputTypeText = document.querySelector("#wpcf7-> form > p:nth-child(2) > span > input"); // выбрали целевой input 

function addValueToInput (event) {
	let choosenElem = Array.prototype.indexOf.call(knopokList, event.target);
	indexToHeaderList = String(headerArr[choosenElem]);
	inputTypeText.setAttribute('value', indexToHeaderList); // [object HTMLHeadingElement]
}


В текстовом инпуте вместо текста заголовка h1 отображается [object HTMLHeadingElement]. Проверял переменную indexToHeaderList
оператором typeof - пишет что это строка, но почему не передается (или не то) в инпут - не ясно.
  • Вопрос задан
  • 48 просмотров
Решения вопроса 1
alexey-m-ukolov
@alexey-m-ukolov Куратор тега JavaScript
- indexToHeaderList = String(headerArr[choosenElem]);
+ indexToHeaderList = headerArr[choosenElem].innerText;

Возможно, вместо innerText вам больше подойдёт textContent (но вряд ли).

оператором typeof - пишет что это строка
Ну так вы же по-любому на typeof проверяли после того как сами руками к строке привели?
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы