1

Всем привет. Как при помощи JS имитировать ручной ввод. То есть притворится как будто кнопки человек жмет. Вот например давайте напишем в div такой текст

Привет это написано при помощи JS

Пишем этот текст сюда.

<textarea id="test">
<textarea>

ДОПОЛНЕНИЕ.

Нужно с имитировать нажатия клавиш. Когда то у меня был такой скрипт но потерял его.

5
  • Какая цель преследуется? Commented 25 февр. 2017 в 11:29
  • @AntonShchyrov это чисто для себя хочу. Бывает нужна такая фишка. Commented 25 февр. 2017 в 12:24
  • Что значит имитировать нажатие?
    – Yuri
    Commented 25 февр. 2017 в 12:36
  • @Yuri так как будто это человек в реале на кнопки жмет на клавиатуре. Commented 25 февр. 2017 в 12:37
  • @Анатолий, а в ниже приведенных ответах не так?
    – Yuri
    Commented 25 февр. 2017 в 12:37

2 ответа 2

7

Самый простой способ

function setText(elem, text, speed) {
  // Обращаемся к элементу
  var e = document.querySelector(elem);

  // Устанавливаем начальную позицию
  var i = 0,
  // Создаём интервал
      int = setInterval(function() {
        // Если позиция равна количеству символов в тексте, то удаляем интервал
        if(i == text.length){
          clearInterval(int);
        };
        // Устанавливаем значение для textarea
        e.value = text.substr(0,i); // Текст от начала до текущей позиции
        // Прибавляем +1 к позиции
        i++;
      }, speed);
      
  // Для фокуса
  e.focus();
  e.onblur = function() { clearInterval(int) };
};

window.onload = function() {
  setText('#test', 'Привет это написано при помощи JS', 300);
};
<p>Убери фокус с поля</p>
<textarea id="test"></textarea>

3
  • @vp_arth, была проблемка в расчётах. Подправил :)
    – Yuri
    Commented 25 февр. 2017 в 11:43
  • @vp_arth да, смисл этого скрипта я понял. Но вот нужно симитировать нажатия клавиш. Так как будто это человек в реале пишет. Commented 25 февр. 2017 в 12:36
  • Бомба прям, благодарю. Commented 25 февр. 2017 в 12:42
5

Вот пример кода, с возможностью генерирования ошибки ввода

var str = 'Привет это написано при помощи JS';

// Генерирование случайного символа
function rndChar() {
  var possible = "абвгдежзийклмнопрстуфхцчшщъыьэюя";
  return possible[Math.floor(Math.random() * possible.length)];
}

function writeText() {
  var area = document.getElementById("test");
  area.value = "";
  var pos = 0;
  var baseProb = 0;
  var isWrong = false;
  var writeChar;
  var sleep = function() {
    // Следующую букву выводим через 100 мс со случайным отклонением +- 50 мс
    setTimeout(writeChar, 100 + Math.random() * 50);
  };
  writeChar = function() {
    // Если был введен ошибочный символ то удаляем его
    if (isWrong) {
      area.value = area.value.substring(0, --pos);
      isWrong = false;
    } else {
      // А не сделать ли нам ошибку с вероятностью baseProb?
      if (Math.random() < baseProb) {
        // Генерируем случайный символ
        var chr = rndChar();
        area.value += chr;
        // Если сгенерировали не то, что нужно, то выставляем флаг ошибки
        isWrong = chr != str[pos++];
        // и уменьшаем вероятность следующей ошибки в 10 раз
        if (isWrong)
          baseProb /= 10;
      } else {
        // Если ошибку решили не делать, то вставляем следующий символ
        area.value += str[pos++];
        // И устанаавливаем вероятность ошибки в 0.1
        baseProb = 0.1;
      }
    }
    // Если еще остались символы, или сделали ошибку,
    // то поставить в очередь вывод следующего
    if (pos < str.length || isWrong)
      sleep();
  };
  sleep();
}
<textarea id="test"></textarea>
<button onclick="writeText()">Write</button>

0

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.