Здравствуйте, уважаемые пользователи сего сайта!
Будучи новичком в изучении языков программирования, я вынужден обратиться к вам всем за помощью следующего характера:
Как html-страницу с автозаполнением формы (в данном случае это автозаполнение происходит при нажатии на кнопку "Заполнить") настроить на автоизменение длины каждой строки ввода (input) в зависимости от посимвольной длины каждого автоматически вводимого "value"?
К примеру, имеется такой синтаксис (обычная html-страница с событием автозаполнения формы при нажатии на кнопки "Заполнить"):
Имя<br>
<input id="name" type="text"><br>
Маил<br>
<input id="email" type="email"><br>
Телефон<br>
<input id="phone" type="tel"><br>
Пароль<br>
<input id="pos_password" type="text"><br>
Повторный пароль<br>
<input id="passwordConfirm" type="text"><br><br>
<button id="rec">Заполнить</button><br>
<script>
rec.onclick=()=>
{
arr=(
prompt(
'Введите данные о себе через запятую \n(имя, мыло, тел, пароль, пароль)',
'Иванов Иван,
ivanov@ivan.ru,8(495)1234567,12345678,12345678'
)+'').split(',');
arr.length==5 && document
.querySelectorAll('input#name,input#email,input#ph one,input#pos_password,input#passwordConfirm')
.forEach((a,b)=>a.value=arr[b])};
</script>
Изначально при автозаполнении у меня часть вводимой информации ("value") не была видна, так как стандартная длина поля ввода "input" маленькая, а содержимое некоторых вводимых строк явно превышает эту длину (по количеству символов, как вы уже поняли).
До сего момента я, имея все свои данные (так называемые "value"), которыми автозаполняю форму, был вынужден посимвольно посчитать их и к каждому "input"-у добавить атрибут "size" с соответствующим числовым значением.
У меня возникла мысль о возможности применения нечта вроде АВТОИЗМЕНЕНИЯ ПОЛЯ ВВОДА "INPUT" ПРИ АВТОЗАПОЛНЕНИИ ФОРМЫ.
Недавно мне для достижения этой цели была предложена идея с применением такого свойства объекта JS как "event".
Далее, задав вопрос с похожей формулировкой на проекте "Ответы@Mail.Ru", я получил от одного из пользователей ответ в виде следующего синтаксиса:
oninput=onchange=()=>{
event.target.tagName=='INPUT'&&event.target.type== 'text'&&(event.target.style.width=(event.target.va lue.length+1)+'ex');
}
Данный синтаксис я проверил в деле, он работает, но в своём классическом виде (то есть, при ручном заполнении строк ввода они вроде как изменяют свой размер как надо)... Но дело в том, что я хочу, чтобы это событие срабатывало ИМЕННО при автозаполнении формы путём нажатия на кнопку! Это вообще возможно или нет???
Заранее спасибо всем и каждому, кто откликнулся!!!