Controllo ortografico forzato su un'area di testo in WebKit

Question

Sto creando un'app per l'immissione di dati/QC basata su browser che consentirà alle persone di modificare i file OCR, che naturalmente hanno tonnellate di errori. I blocchi di dati vengono inseriti nelle aree di testo in modo che possano essere controllati, ma le sottolineature rosse vengono visualizzate solo quando l'utente inserisce manualmente il cursore in una parola errata.

C'è un modo per forzare WebKit ad aggiungere le piccole sottosezioni di controllo ortografico rosso a textareas?

Answer 1

In sostanza è necessario utilizzare l'api di selezione per spostare il punto di inserimento su ogni parola per fare in modo che Safari lo evidenzia. Ecco un esempio per eseguire la scansione per i primi mille parole ...

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

Questo codice è stato sollevato dal WebKit Layout test suite.

Answer 2

Non ho idea se questo funzionerà o meno, ma potresti voler provare a giocare con le selezioni. In altre parole, dopo aver aggiornato il vostro textarea (e si vuole "refresh" per rendere lo spettacolo sottolineatura rossa), si potrebbe essere in grado di fare qualcosa di simile:

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

Si può trovare un po 'di più su come utilizzare le selezioni qui: How do I select arbitrary text on the page using javascript? o tramite una ricerca su Google.

Il mio pensiero è che creare una selezione (o magari cancellarla dopo averla creata) potrebbe innescare un evento del browser diverso che causa l'aggiornamento del controllo ortografico ... ma è solo un'idea; potrebbe fare esattamente la stessa cosa dell'impostazione di textArea.value (cioè niente).

Answer 3

È possibile che se si utilizza il Doctype HTML5, è possibile utilizzare l'attributo di controllo ortografico. A similar question was asked here on StackOverflow e approfondisce l'attributo di controllo ortografico.

Answer 4

Grande risposta di Mark Fowler, qui è un miglioramento su di esso:

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

modo da poter evitare l'arbitrio 1000 Numero ed è in grado di gestire più linee.