Force spell check on a textarea in 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?

回答1:

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 

This code was lifted from the WebKit Layout test suite.

回答2:

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).

回答3:

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 

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

回答4:

It's possible that if you use the HTML5 Doctype, you can use the spellcheck attribute. A similar question was asked here on StackOverflow and delves deeper into the spellcheck attribute.

文章来源: Force spell check on a textarea in WebKit