Показывать подчеркивание немедленно, когда html-элемент имеет contenteditable = "true" spellcheck = "true"

Question

Я бы хотел выделить орфографические ошибки в промежутке при загрузке страницы, например,

<span contenteditable="true" spellcheck="true">gibberishnonesense</span>

В настоящее время gibberishnonesense не подчеркивается, если я не нажму на промежуток.Я хотел бы, чтобы подчеркивание происходило при загрузке страницы.Кажется, что подчеркивание происходит только тогда, когда вы активно начинаете редактирование.

Есть ли настройка, на которую мне нужно перейти, подчеркнутая без редактирования?Есть ли событие, которое я могу отправить на диапазон, который активирует его - и не меняет activeElement или фокус (избегайте el.focus();?

Мне известно о стиле с text-decoration-style: wavy; но этот стиль подчеркивания другой, и я хотел бы использовать проверку орфографии агента пользователя.

=== То, что я пробовал:

Изменение содержимого элементов с помощью JS

el.innerText += ''

Отправка события "change" через JS

var manualChange = new Event('change');
el.dispatchEvent(manualChange);

===

Некоторые исследования показывают, что это специфичное для Chrome поведение, однако я нацеливаюсь на Chrome и поэтому мне нужноработать там.

Я вижу из другой вопрос , что существует forceSpellchek метод , который еще не реализован в Chrome

Answer 1

Я никогда не находил удовлетворительного решения этой проблемы - как вы говорите, проверка орфографии не срабатывает, пока вы не нажмете на спорный документ.

Единственный ответ, который я придумал, - вставитьбаннер (например, div) при загрузке в начале документа с надписью «Нажмите, чтобы активировать проверку орфографии» - затем нажмите, удалите div.

Сам акт нажатия на div активирует проверку орфографии, но это немного неуклюже, и, поскольку все мои пользователи создают статьи из новых, я в конечном итоге отбросил их.

Я также считаю, что проверка орфографиивставляет вставку, так что, возможно, стоит исследовать маршрут - это не то, что я пробовал.