Hoe detecteer je een spelfout in een tekstgebied in JavaScript? Is hier een evenement aan verbonden? Hoe krijg ik toegang tot de spellingcontrolesuggesties van Chrome voor een verkeerd gespeld woord?
Antwoord 1, autoriteit 100%
Hoe krijg ik toegang tot de spellingcontrolesuggesties van Chrome voor een verkeerd gespeld woord?
Voor zover ik weet, kunt u dat niet. Om een vollediger antwoord te geven, zal ik ook gerelateerde problemen vermelden:
- Er was eens een onofficiële Google-spellingcontrole-API die is verdwenen
- Je kunt downloaden, maar geen toegang krijgenhet ingebouwde woordenboek van Chrome
- Er is geen open API voor het woordenboek van Google
Is hier een evenement aan verbonden?
Nee, noch het contextmenu-gebeurtenis bieden iets nuttigs voor dit doel: het heeft geen spellingcontrole-informatie en u kunt de lijst met contextmenu-items (die spellingsuggesties kunnen bevatten) niet lezen. De gebeurtenis changedoet ook’ geen spellingcontrole-informatie verstrekken.
Hoe detecteer je een spelfout in een tekstgebied in JavaScript?
Je kunt dit zelf coderen of een bibliotheek van derden gebruiken. Er zijn andere Stack Overflow-vragen over dit onderwerp of u kunt zelf zoeken. Gerelateerde vragen over Stack Overflow zijn onder meer:
- Javascript spellingcontrolemethoden
- aanbevelingen voor JavaScript-spellingcontrole
- Op Javascript gebaseerde spellingcontrole voor webapplicaties
- Spellingcontrole toevoegen aan mijn website
- Spellingcontrole aan clientzijde nodig voor DIV
- javascript spellingcontrole
Antwoord 2, autoriteit 62%
Omdat de vraag een beetje breed en open voor interpretatie lijkt (vooral met de huidige premie-‘vereisten’), zal ik beginnen met uit te leggen hoe ik het interpreteer en proberen de subvragen in het proces te beantwoorden (Q/A-stijl ).
Je lijkt te vragen:
“Google Chrome”/”Chromium” specifiek:
-
V:als browser “Google Chrome”/”Chromium” een spellingcontrole-API weergeeftwaarmee u interactie kunt gebruiken door middel van javascript op een gemeenschappelijke webpagina
A:Nee, niet echt (tenminste niet op de manier die je zou willen).
Er is een Chromium-specifieke Spellcheck API Voorstel(van december 2012).Hier zijn enkele delen ervan:
Kan deze API deel uitmaken van het webplatform?
Het is onwaarschijnlijk dat spellingcontrole onderdeel wordt van het webplatform.Wat nog belangrijker is, het heeft maar één methode genaamd ‘loadDictionary’:
loadDictionary( myDictionaryFile // string path or URL , dictionaryFormat // enumerated string [ "hunspell" (concatentation of .aff and .dic files) // , "text" (plain text) // ] ) // returns int indicating success or an error code in loading the dictionary.Het punt? De gemeenschap helpen bij het maken van aangepaste woordenboeken voor Zulu, Klingon, enz. omdat ongeveer 20-30% van de Spellcheck-bugrapporten betrekking hadden op niet-ondersteunde talen.
Laten we de SpellCheck API(hierboven) van Chrome niet verwarren met de SpellCheck APIvan Chrome/Webkit (hoe? zeg je wat?):
Hironori Bono (een software-engineer voor Google Chrome) stelde een API voorrond 2011 en enkele gerelateerde bugrapportenen een patchdie was(/is nog steeds?) in Chrome.void addSpellcheckRange( unsigned long start , unsigned long length , DOMStringList suggestions // [, unsigned short options] ); void removeSpellcheckRange(SpellcheckRange range);Gebruiksvoorbeeld:
var input = document.querySelector('input'); input.addSpellcheckRange( 4 , 9 , [ 'Chrome' , 'Firefox' , 'Opera' , 'Internet Explorer' ] );
Bronnen:
http://html5-demos.appspot.com /static/html5-whats-new/template/index.html#42,
http://peter.sh/experiments/spellcheck-api/(u zou moeten kunnen probeer het daar live ALS deze API nog steeds werkt..)
Het punt? Nadat ik hier een paar dagen over had nagedacht, klikte het plotseling: aangepaste spellingcontrole-integratie met de browser – met behulp van het contextmenu van de browser in plaats van het te blokkeren en uw eigen te verstrekken. Je zou dat dus kunnen koppelen aan een bestaande externe bibliotheek voor spellingcontrole.Bovenstaande historische en experimentele API’s hebben duidelijk nooit direct ondersteund wat u wilt bereiken.
- V:als “Google Chrome”/”Chromium” spellingcontrole-API een ‘onSpellError’ (-like) gebeurtenisop (bijvoorbeeld) een tekstgebied
A:Zoals hierboven beschreven, lijkt het erop dat Chrome zo’n evenement niet heeft.
HTM5 biedt momenteel alleen de mogelijkheid om spellingcontrole in of uit te schakelen voor door spellingcontrole ondersteunde elementen. - V:hoe toegang te krijgen tot de spellingcontrolesuggesties van Chrome voor een verkeerd gespeld woord
A:Zoals hierboven uiteengezet: het lijkt erop dat u dat niet kunt. Het lijkt hetzelfde antwoord te zijn als voor de bijna dubbele vraag: Hoe heb ik toegang tot het woordenboek voor spellingcontrole van Chrome?
Het is misschien interessant om op te merken dat “TinyMCE’s spellingcontrole eerder werd geleverd door het ‘hacken’ van een Chrome-werkbalk-API die eigendom is van Google , in strijd met het eigen legale gebruiksbeleid van Google. Deze spellingcontroleservice is definitief stopgezet.“. Als je nu op internet zoekt, kun je waarschijnlijk vinden hoe ze dat hebben gedaan, maar het lijkt zeker niet de beste manier om dit aan te pakken (en pleit er hier voor).
Met javascript-bibliotheken voor spellingcontrole kunt u echter de woordenboeken van Chrome gebruiken (u hoeft de woordenboeken dus niet te onderhouden), maar u moet deze bestanden samen met uw web-app aanleveren en verzenden (in plaats van de geïnstalleerde in de browser op te halen ).
Algemeen:
-
V:hoe een spelfout in een tekstgebied in JavaScript te detecteren
A:Internet Explorer staat het gebruik van de spellingcontrole toe
geïntegreerd in Microsoft Word via ActiveX zoals hieronder vermeld:
codefragment.function CheckText(text) { var result = new Array; var app = new ActiveXObject('Word.Application'); var doc = app.Documents.Add(); doc.Content = text; for (var i = 1; i <= doc.SpellingErrors.Count; i++) { var spellingError = doc.SpellingErrors.Item(i); for (var j = 1; j <= spellingError.Words.Count; j++) { var word = spellingError.Words.Item(j); var error = {}; error.word = word.Text; error.start = word.Start; error.length = word.Text.length; error.suggestions = new Array; var suggestions = word.GetSpellingSuggestions(); for (var k = 1; k <= suggestions.Count; k++) { error.suggestions.push(suggestions.Item(k).Name); } result.push(error); } } return result; }Bron: https://lists.w3 .org/Archives/Public/public-webapps/2011AprJun/0516.html
Maar IE/ActiveX/MS-Word is niet echt waar je om hebt gevraagd, en het is ook niet erg platformonafhankelijk/browser, waardoor we lokale javascript-bibliotheken voor spellingcontrole hebben:
Javascript spellingcontrolemethoden
http://code.google.com/p/bjspell/
http://www.javascriptspellcheck.com/
http://ejohn.org/blog/revised-javascript-dictionary-search/
enz.
Ze vergelijken/uitleggen valt eigenlijk buiten het bestek van dit antwoord.
Het is vermeldenswaard welk woordenboekformaat u wilt gebruiken!U kunt ook een externe API-service voor spellingcontrole gebruiken (waarbij een server de gegevens verwerkt en u ermee communiceert via AJAX).
Uiteraard moet u rekening houden met privacykwesties!
De premie-‘vereisten’ vragen om:
- V:definitief bewijs
A:Ik had iets meer over het onderwerp moeten vinden dan enkele esoterische experimentele kenmerken. Ik zie ook geen bibliotheken die hun functionaliteit proberen te verschuiven naar een (aanstaande) gestandaardiseerde methode/gebeurtenis-ID’s enz.
Zoals opgemerkt, hebben populaire bibliotheken zoals TinyMCE momenteel ook geen andere oplossing.
In de ‘levensstandaard’/’de wereld is onze speeltuin’ mentaliteit zou mijn antwoord best al achterhaald kunnen zijn als ik op de ‘submit’-knop druk. Maar zelfs dan zou ik zo’n experimentele feature in de nabije toekomst niet aanraden op een ‘productie’ niveau website/interface. - V:en een goed antwoord krijgen waarin wordt uitgelegd hoe u dit kunt bereiken
(specifiek voor Chrome of in het algemeen? Spellingcontrolesuggesties of detecteren dat er een typefout is?)
A:Afgezien van het bovenstaande kan ik niets bedenken (behalve bibliotheken die webontwikkelaars momenteel gebruiken (zie 4)).
Hopelijk helpt dit!
Antwoord 3, autoriteit 15%
Er is geen API voor toegang tot de spellingcontrolesuggesties van Chrome, en er worden ook geen gebeurtenissen geactiveerd wanneer woorden verkeerd worden getypt. Evenementen kunnenechter worden geïmplementeerd.
Ik heb geen idee wat uw gebruiksscenario is voor deze functionaliteit, maar ik heb een demonstratie samengesteld met behulp van montanaflynn’s Spellingcontrole-API op MashApe. De demo bekijkt een tekstgebied en wanneer de gebruiker het typen onderbreekt, verzendt het de tekst via de API om te testen. De API retourneert JSON met de originele tekenreeks, de voorgestelde gecorrigeerde tekenreeks en een object met de gecorrigeerde woorden en hun voorgestelde vervangingen.
De suggesties worden weergegeven onder het tekstgebied. Als er suggesties worden weergegeven, wordt het verkeerd getypte woord gemarkeerd. Wanneer erop wordt geklikt, wordt de typfout vervangen door de suggestie.
Ik heb ook een shuffle-functie toegevoegd, die de woorden in de string vervormt voordat deze wordt verzonden, om een privacylaag toe te voegen aan het gebruik van de API (het gebruikt ook SSL). Noch de API, noch Chrome gebruiken op context gebaseerde suggesties, dus het shuffelen verandert niets aan de resultaten.
Hier is een link naar de CodePen: http://codepen.io/aecend/pen/rOebQq
En hier is de code:
CSS
<style>
* {
font-family: sans-serif;
}
textarea {
margin-bottom: 10px;
width: 500px;
height: 300px;
padding: 10px;
}
.words {
width: 500px;
}
.word {
display: inline-block;
padding: 2px 5px 1px 5px;
border-radius: 2px;
background: #00B1E6;
color: white;
margin: 2px;
cursor: pointer;
}
</style>
HTML
<textarea id="text" placeholder="Type something here..."></textarea>
<div id="words"></div>
JavaScript
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>
;(function(){
"use strict";
var words = document.getElementById("words"),
input = document.getElementById("text"),
timeout, xhr;
input.addEventListener("keyup", function(e){
if (timeout) clearTimeout(timeout);
if (!this.value.trim()) words.innerHTML = '';
timeout = setTimeout(function() {
var test_phrase = shuffle_words( input.value );
spell_check(test_phrase);
timeout = null;
}, 500);
});
function shuffle_words(inp) {
inp = inp.replace(/\s+/g, ' ');
var arr = inp.split(" "),
n = arr.length;
while (n > 0) {
var i = Math.floor(Math.random() * n--),
t = arr[n];
arr[n] = arr[i];
arr[i] = t;
}
return arr.join(' ');
}
function spell_check(text){
if (xhr) xhr.abort();
xhr = $.ajax({
url: 'https://montanaflynn-spellcheck.p.mashape.com/check/',
headers: {
'X-Mashape-Key': 'U3ogA8RAAMmshGOJkNxkTBbuYYRTp1gMAuGjsniThZuaoKIyaj',
'Accept': 'application/json'
},
data: {
'text': text
},
cache: false,
success: function(result){
xhr = null;
suggest_words(result);
}
});
}
function suggest_words(obj){
if (!obj.corrections) return;
words.innerHTML = '';
for (var key in obj.corrections) {
if (obj.corrections.hasOwnProperty(key)) {
var div = document.createElement("div");
div.className = "word";
div.innerHTML = obj.corrections[key][0];
div.orig = key;
div.onmouseover = function() {
var start = input.value.indexOf(this.orig);
input.selectionStart = start;
input.selectionEnd = start + this.orig.length;
};
div.onmouseout = function() {
var len = input.value.length;
input.selectionStart = len;
input.selectionEnd = len;
}
div.onclick = function() {
input.value = input.value.replace(this.orig, this.innerHTML);
this.parentNode.removeChild(this);
}
words.appendChild(div);
}
}
}
})();
</script>
Ik heb jQuery alleen gebruikt om het AJAX-verzoek voor deze demonstratie te vereenvoudigen. Dit kan gemakkelijk worden gedaan in vanilla JS.
Antwoord 4
U kunt bijvoorbeeld de spellingcontrole van de interne browser uitschakelen en elke andere opensource-bibliotheek voor spellingcontrole integreren
JavaScript-spellingcontrole. Het bevat alle gebeurtenissen die u nodig heeft voor diepe integratie, kijk op de API-pagina.