Como aceder às sugestões de verificação ortográfica do Chrome em JavaScript

como é que se detecta um erro ortográfico dentro de uma área de texto em JavaScript? Há algum evento associado a isto? Como acedo às sugestões de verificação ortográfica do Chrome para uma palavra mal escrita?

Author: Ninjakannon, 2015-06-08
Source

4 answers

Como posso aceder às sugestões de verificação ortográfica do Chrome para uma palavra mal escrita?

Tanto quanto sei, não podes . Para responder de forma mais completa, mencionarei também questões relacionadas:

    Houve uma vez uma API não oficial de verificação ortográfica do Google que desapareceu.
  • Você pode baixar mas não aceder o Chrome está construído no dicionário
  • não existe uma API aberta para o dicionário do Google
Há algum evento associado a isto?

Não, nem a contextmenu evento fornecer qualquer coisa útil para este propósito: ele não tem nenhuma informação de verificação ortográfica e você não pode ler a lista de itens do menu de contexto (que pode conter sugestões de ortografia). O change o evento também não fornece informações de verificação ortográfica.

Como é que se detecta um erro ortográfico dentro de uma área de texto em JavaScript?

Pode codificar isto sozinho ou usar um biblioteca de terceiros. Existem outras questões de excesso de pilha sobre este tópico ou você pode procurar por si mesmo. As questões relacionadas com o excesso de fluxo da pilha incluem:

 24
Author: Ninjakannon, 2015-09-23 13:52:07

Como a pergunta parece um pouco ampla e aberta à interpretação (especialmente com o bounty atual-'requirements'), vou começar por explicar como eu interpretá-la e tentar responder às subquestões no processo (estilo Q/A).

Parece estar a perguntar:

"específico do Google Chrome"/"cromo" :

  1. Q: se o navegador "Google Chrome"/"Cromo" expõe uma verificação ortográfica-API que você pode interagir com a utilização de javascript numa página web comum
    R: Não, Não realmente (pelo menos não da maneira que você gostaria).
    Existe uma proposta de Verificação Ortográfica específica para o crómio ([28]} (a partir de dezembro de 2012).

    Aqui estão algumas partes.

    Esta API poderia fazer parte da plataforma web?
    É improvável que spellchecking se torne parte da plataforma web.

    Mais importante, só tem um método. denominado "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.
    Qual é o objectivo? Ajudando a comunidade a criar dicionários personalizados para Zulu, Klingon, etc. porque aproximadamente 20-30% dos bugs-rapports Spellcheck estavam relacionados a linguagens não apoiadas. Agora não vamos confundir a API do Chrome com a API do Chrome/Webkit do SpellCheck (hu? o quê?):
    Hironori Bono (um engenheiro de software para o Google Chrome) propôs uma API por volta de 2011 e algum bug relacionado com rapports and a patch that was (/is still?) in Chrome. 
    void addSpellcheckRange( unsigned long start
                       , unsigned long length
                       , DOMStringList suggestions
                   // [, unsigned short options]
                       );
void removeSpellcheckRange(SpellcheckRange range);

    Exemplo de Utilização: 

    var input = document.querySelector('input');
input.addSpellcheckRange( 4
                        , 9
                        , [ 'Chrome'
                          , 'Firefox'
                          , 'Opera'
                          , 'Internet Explorer'
                          ]
                        );

    from http://peter.sh/experiments/spellcheck-api/
    Sources:
    http://html5-demos.appspot.com/static/html5-whats-new/template/index.html#42 ,
    http://peter.sh/experiments/spellcheck-api/ (você deve ser capaz de experimentar, ao vivo lá SE esta API ainda funciona..)
    O objectivo? Depois de contemplar isso um par de dias, de repente clicou: personal verificação ortográfica integração com o navegador - usando o menu de contexto do navegador em vez de bloqueá-lo e fornecer o seu próprio. Pode-se ligar isso a uma biblioteca externa de verificação ortográfica.

    Acima da API histórica e experimental, claramente, nunca suportou directamente o que quer alcançar.
  2. Q: Se "Google Chrome" /" Chromium "spellcheck-API expõe um' onSpellError ' (- like) evento on (por exemplo) a textarea
    A: Como descrito acima, parece que o Chrome não tem tal evento.
    O HTM5 só expõe a capacidade de activar ou desactivar a verificação ortográfica dos elementos suportados pela verificação ortográfica.
  3. P: como acesso Chrome verificação ortográfica sugestões para uma palavra com erros ortográficos
    A: Como descrito acima: parece que você não pode. Ele parece ser a mesma resposta para quase duplicar-pergunta: Como posso acessar o Chrome verificação ortográfica dicionário?
    Pode ser interessante notar que " [[100]}o spellchecker do TinyMCE foi anteriormente fornecido por 'hackear' uma API Chrome toolbar de propriedade do Google, contra as próprias políticas de uso legal do Google. Este serviço de verificação ortográfica foi descontinuado permanentemente.". Agora, se você procurar na web você provavelmente pode encontrar como eles fizeram isso, mas certamente não parece a melhor maneira de ir sobre isso (e defendê-lo aqui).
    Usar as bibliotecas de verificação ortográfica do javascript poderá, contudo, usar Os dicionários do Chrome (para que não precisasse de manter os dicionários), mas teria de fornecer e enviar estes ficheiros juntamente com o seu web-app (em vez de obter os instalados no navegador).

Aspectos Gerais:

  1. Q: Como detectar um erro ortográfico dentro de um textarea em JavaScript
    A: o Internet Explorer permite usar o spellchecker integrado no Microsoft Word via ActiveX, conforme listado no seguinte excerto de código.

    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;
}

    Fonte: https://lists.w3.org/Archives/Public/public-webapps/2011AprJun/0516.html

    Mas IE / ActiveX/MS-Word não é realmente o que você pediu, nem é muito cross platform/ browser, que nos deixa com bibliotecas de verificação ortográfica do javascript local:
    Verificação Ortográfica de Javascript Methods
    http://code.google.com/p/bjspell/
    http://www.javascriptspellcheck.com/
    http://ejohn.org/blog/revised-javascript-dictionary-search/
    Etc.
    Comparando-os / explicando-os está realmente fora do âmbito desta resposta.
    Vale a pena notar o formato do dicionário que você deseja usar!

    Alternativamente, pode-se usar um serviço externo de API de verificação ortográfica (onde um servidor lida com os dados e você se comunica com ele usando FORUM).
    É óbvio que tens de ter em conta as questões de Privacidade!

The bounty - "requirements" ask for:

  1. Q: prova definitiva
    R: eu deveria ter encontrado algo mais a respeito do assunto do que algumas características Esotéricas experimentais. Nem eu vejo bibliotecas que tentam reduzir sua funcionalidade em alguns (próximos) identificadores de método/evento padronizados, etc.
    Como observado, bibliotecas populares como TinyMCE também actualmente, não há outra solução.
    Na mentalidade de "nível de vida" / "o mundo é o nosso parque infantil", a minha resposta pode muito bem já estar desactualizada quando carrego no botão "Submeter". Mas mesmo assim eu não recomendaria tal recurso experimental em um futuro próximo em um site/interface nível de "produção".
  2. Q: e obter uma boa resposta explicando como conseguir isso
    (cromado específico ou em geral? Verificação ortográfica sugestões ou detecção de que existe um erro de Digitação?)
    A: Para além do acima, não consigo pensar em nada (para além das bibliotecas que os programadores da web usam actualmente (ver 4)).
Espero que isto ajude!
 17
Author: GitaarLAB, 2017-05-23 12:26:38
Não existe uma API para aceder às sugestões de verificação ortográfica do Chrome, nem existem quaisquer eventos disparados quando as palavras são mistificadas. No entanto, os Eventos podem ser implementados.

Não faço ideia de qual é o teu Estojo de uso para esta funcionalidade, mas fiz uma demonstração usando a API de Verificação Ortográfica do montanaflynn no MashApe . A demonstração observa uma área de texto, e quando o usuário pára de escrever, ele envia o texto através da API para ser testado. A API devolve JSON contendo a cadeia original, a cadeia corrigida sugerida, e um objeto contendo as palavras corrigidas e suas substituições sugeridas.

As sugestões são apresentadas por baixo da área de texto. Quando as sugestões são pairadas, a palavra mistipada é realçada. Quando clicado, o erro é substituído pela sugestão.

Eu também adicionei uma função de baralhar, que baralha as palavras no texto antes de enviá-lo, para adicionar uma camada de privacidade ao uso da API (ele também usa SSL). Nem a A API nem o Chrome usam sugestões baseadas em contexto, para que a baralhação não altere os resultados.

Aqui está uma ligação ao CodePen: http://codepen.io/aecend/pen/rOebQq

E aqui está o código:

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>
Só usei o jQuery para simplificar o pedido do AJAX para esta demonstração. Isto poderia facilmente ser feito em vanilla JS.
 5
Author: aecend, 2015-09-19 09:26:29

Pode desactivar a verificação ortográfica interna do navegador e integrar qualquer outra biblioteca de verificação ortográfica do opensource, por exemplo Verificação Ortográfica JavaScript . Ele contém todos os eventos que você pode precisar para a integração profunda, verifique a página API .

 0
Author: Eugene Tiurin, 2015-09-23 05:20:40