javascript - 对 WebKit 中的文本区域强制进行拼写检查

Question

我正在创建一个基于浏览器的 QC/数据输入应用程序，它可以让人们编辑 OCRed 文件，这些文件自然会产生大量错误。数据块放在文本区域中以便可以检查它们，但红色下划线仅在用户手动将光标放在拼写错误的单词上时才会出现。

有没有办法强制 WebKit 将红色的小拼写检查下划线添加到 textareas？

Answer 1

本质上，您需要使用 selection api 将插入点移动到每个单词上，以使 Safari 突出显示它。这是一个扫描前一千个单词的示例...

textarea = document.getElementById("mytextarea");
textarea.focus();

var selection = window.getSelection();
selection.modify("move", "backward", "line");
for (var i = 0; i < 1000; i++ ) {
    selection.modify("move", "forward", "word");
}

// Remove focus from the element, since the word under
// the cursor won't have a misspelling marker.
textarea.blur();

此代码是从WebKit 布局测试套件中提取的。

Answer 2

我不知道这是否真的有效，但您可能想尝试使用选择的东西。换句话说，在您更新您的 textarea 之后（并希望“刷新”它以显示红色下划线），您可能可以执行以下操作：

var length = document.getElementById('TEXTAREA#your').value.length;
document.getElementById('TEXTAREA#your').setSelectionRange(0, length);

您可以在此处找到有关如何使用选择的更多信息： 如何使用 javascript 在页面上选择任意文本？或通过谷歌搜索。

我的想法是创建一个选择（或者在创建它之后清除它）可能会触发一个不同的浏览器事件，从而导致拼写检查刷新......但这只是一个想法；它可能会做与设置 textArea.value 完全相同的事情（即什么都没有）。

Answer 3

Mark Fowler 给出了很好的回答，这里有一个改进：

textarea = document.getElementById("mytextarea");
textarea.focus();
var textLength = textarea.value.length;

var selection = window.getSelection();
for (var i = 0; i < textLength; i++ ) {
    selection.modify("move", "backward", "character");
}

// Remove focus from the element, since the word under
// the cursor won't have a misspelling marker.
textarea.blur();

所以你可以避免任意的 1000 数字，它可以处理多行。