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

发布于 2024-08-14 18:14:48 字数 160 浏览 1 评论 0原文

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

有没有办法强制 WebKit 将红色拼写检查下划线添加到文本区域?

I'm creating a browser based QC/data entry app that will let people edit OCRed files, which naturally have tons of errors. Chunks of data are put in textareas so they can be checked, but the red underlines only appear when the user manually puts the cursor in a misspelled word.

Is there a way to force WebKit to add the little red spell check underlines to textareas?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

椒妓 2024-08-21 18:14:48

本质上,您需要使用选择 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 布局测试套件

Essentially you need to use the selection api to move the insertion point over each word to get Safari to highlight it. Here's an example to scan over the first thousand words...

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();

This code was lifted from the WebKit Layout test suite.

想你的星星会说话 2024-08-21 18:14:48

我不知道这是否真的有效,但你可能想尝试使用选择的东西。换句话说,在更新文本区域后(并且想要“刷新”它以显示红色下划线),您也许可以执行以下操作:

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

您可以在此处找到有关如何使用选择的更多信息:
如何使用以下命令选择页面上的任意文本javascript? 或通过 Google 搜索。

我的想法是,创建一个选择(或者可能在创建后清除它)可能会触发不同的浏览器事件,从而导致拼写检查刷新......但这只是一个想法;它可能会执行与设置 textArea.value 相同的操作(即什么都不做)。

I have no idea if this will actually work or not, but you might want to try playing with the selection stuff. In other words, after you update your textarea (and want to "refresh" it to make the red underline show), you might be able to do something like:

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

You can find a bit more on how to use selections here:
How do I select arbitrary text on the page using javascript? or via a Google search.

My thinking is that creating a selection (or maybe clearing it after you create it) might trigger a different browser event which causes the spellcheck refresh ... but that's just an idea; it might do the same exact thing as setting textArea.value (ie. nothing).

时光病人 2024-08-21 18:14:48

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 数字,并且它可以处理多行。

Great answer from Mark Fowler, here is an improvement on it:

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();

So you can avoid the arbitrary 1000 number and it can handle multiple lines.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文