Имитация ввода текста

129
30 декабря 2020, 20:20

В данном коде текст вставляется в форму сразу весь. Как сделать что-то на подобии animate(), чтобы пользователь видел как в форме печатается автоматически текст?

$('input').val('New Text');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<input type="text">

Answer 1

Если туда нужно равномерно печатать текст, без пауз и т.п., можно так:

(function(){ 
 
let text = ('New Text about Lorem ipsum dolor ame...').split(''); 
//Строчку превратили в массив. Каждый отдельный символ - отдельный элемент. 
let bubu = document.getElementById('bubu'); 
 
for( let i = 0; i < text.length; i++ ){ 
  setTimeout( function(){ 
    bubu.value += text[i]; 
  }, i*100);  
  // Цикл-то срабатывает сразу, а поставленный таймаут зависит от значения i 
  // На каждом круге - будет больше. 
} 
 
console.log( String(text) ); 
 
})();
<input id="bubu" type="text" style="width: 400px;">

READ ALSO
Не отображается код клавиш PageDown, PageUp

Не отображается код клавиш PageDown, PageUp

Собственно не отображется код клавиш PageUp, PageDown и 4 стрелки, которые находятся внизу

110
как сделать цикл из классов

как сделать цикл из классов

Как правильно написать цикл для увеличения цифр (обоих, которые идут и после а и после _) с шагом 1 до 33(включительно)Чтоб получалось

116
Высота родительского блока?

Высота родительского блока?

Добрый есть простая разметка родительский блок в котором вложена картинка (лишнее убрал):

131
Адаптивное расположение иконок

Адаптивное расположение иконок

Я новичок в css, поэтому извиняюсь за простой вопросИмеется страница с иконками в столбик

106