Ввод текста в textarea очень медленный, когда много текста внутри

Я пробовал это в Chrome. Имея текстовое поле с большим количеством текста внутри, редактирование частей в конце становится супер медленным. Курсор и ответ ввода клавиатуры поступают в обход.

Но если я сделаю так, чтобы ссылки CSS были перемещены с <head> до после </body>, это не будет медленнее. Любые идеи, почему это явление существует?

Используемый код:

<!DOCTYPE html>
<html>
    <head>
        <style>textarea {width: 400px; height: 400px;}</style>
        <link href="1.css" rel="stylesheet" type="text/css">
    </head>

    <body>
        <textarea name="content"></textarea>
    </body>
</html>

Этот html фактически генерируется скриптами, которые заполнят содержимое текстовой области тысячами строк текста. Когда пользователь прокручивается до конца содержимого, то, где начинается медленность. Если css в области головы удалено, оно будет быстрым.

Ответ 1

Установите spellcheck на false:

<textarea spellcheck="false"></textarea>

Это может помочь.


По предложению Августина вы также можете попробовать добавить этих парней:

<textarea autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">

Ответ 3

У меня была та же проблема, но я решил ее со следующим атрибутом ng-model-options="{ updateOn: 'blur' }"

попробуйте

<textarea ng-model-options="{ updateOn: 'blur' }"></textarea>

Ответ 4

Не видя живого примера, это трудно сказать. Но несколько возможных причин:

  • Вы используете пользовательские шрифты в textarea (font-face? SIFr?), что замедляет работу браузера из-за дополнительных накладных расходов. В частности, если вы используете что-то вроде SIFr!
  • Проблема проверки: действительно ли ваш HTML/CSS? Попробуйте запустить его с помощью валидации W3: (HTML, CSS).
  • Вы используете JavaScript на странице? Возможно, некоторые проверки или другие процессы, которые могут быть вызваны с помощью textarea?

Мое ожидание будет состоять в том, что он один из двух последних пунктов выше, чтобы попытаться помочь справиться с проблемой, попробуйте:

  • Запуск вашей разметки через валидаторы и решение любых поднятых проблем. Он все еще делает это?
  • Отключить JavaScript и загрузить страницу. Он все еще делает это?

Я ожидаю, что вы сможете очень быстро сузить причину.

PS: не помещайте CSS нигде, кроме как в голову - это вызовет у вас всевозможные другие проблемы!

Ответ 5

Если проблема возникает только в Chrome, это может быть проверка орфографии.

Согласно ссылке, предоставленной @PapaKai, может помочь отключение проверки орфографии. (недавно предложенный)

Вы можете отключить проверку орфографии только в текстовом поле с помощью < textarea spellcheck = "false" > как объяснено в this answer