Javascript Girl
  1. Javascript Girl
  3. Forcer la vérification orthographique sur une zone de texte dans WebKit
Intereting Posts
La suppression d'un élément de script supprime-t-elle ses fonctions de la mémoire? Comment réaliser que "ui-sref" soit exécuté conditionnellement? Puis-je utiliser une ID comme nom de variable? Obtenir l'URL de la page actuelle dans l'extension Chrome IndexedDB: stockez le fichier sous Fichier ou Blob ou ArrayBuffer. Quelle est la meilleure option? Facebook: écran vide sur FB Login Existe-t-il un moyen de rendre la mise en page parfaitement adaptée au zoom à 100%, mais aussi respecter de plus grands facteurs de zoom? Reason Render Array dans le retour mappé Dois-je écrire un script dans le corps ou la tête du html? Modification de la date Utc en date locale à l'aide de moment.js Fonction de réaction d'appel à l'intérieur de la fonction anonyme Ui-routeur angulaire: conservez le même ui-view pour enfant Comment rendre la différence contextuelle entre deux timestamps en JavaScript? Capture d'alerte Javascript dans Webbrowser Control PushState et SEO

Forcer la vérification orthographique sur une zone de texte dans WebKit

Je crée une application de QC / data entry basée sur le navigateur qui permettra aux personnes d'éditer les fichiers OCRed, qui ont naturellement des tonnes d'erreurs. Les morceaux de données sont mis dans les zones de texte afin qu'ils puissent être vérifiés, mais les soulignements rouges n'apparaissent que lorsque l'utilisateur met manuellement le curseur dans un mot mal orthographié.

Existe-t-il un moyen de forcer WebKit à ajouter les légers soulignements de la correction d'orthographe rouge aux listes de texte?

Essentiellement, vous devez utiliser la sélection api pour déplacer le point d'insertion sur chaque mot pour que Safari le mette en surbrillance. Voici un exemple pour analyser les 1000 mille mots … 

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

Ce code a été supprimé de la suite de tests WebKit Layout .

Je ne sais pas si cela fonctionnera ou non, mais vous voudrez peut-être essayer de jouer avec les éléments de sélection. En d'autres termes, après avoir mis à jour votre zone de texte (et souhaitez "l'actualiser" pour faire apparaître le soulignement rouge), vous pourriez être en mesure de faire quelque chose comme: 

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

Vous pouvez trouver un peu plus sur la façon d'utiliser les sélections ici: Comment puis-je sélectionner du texte arbitraire sur la page à l'aide de javascript? Ou via une recherche Google.

Je pense qu'en créant une sélection (ou peut-être la dégager après la création) peut déclencher un événement de navigateur différent qui provoque le rafraîchissement de la correction d'orthographe … mais ce n'est qu'une idée; Il pourrait faire la même chose exacte que le paramètre textArea.value (c.-à-d. Rien).

Grande réponse de Mark Fowler, voici une amélioration: 

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

Ainsi, vous pouvez éviter le nombre 1000 arbitraire et il peut gérer plusieurs lignes.

Il est possible que si vous utilisez le Doctype HTML5, vous pouvez utiliser l'attribut spellcheck. Une question similaire a été posée ici sur StackOverflow et approfondit l'attribut spellcheck.