如何在JavaScript中访问Chrome拼写检查建议

如何在JavaScript中检测文本区域内的拼写错误？是否有与此相关的事件？对于拼写错误的单词，如何访问Chrome的拼写检查建议

对于拼写错误的单词，如何访问Chrome的拼写检查建议

就我所知。为了更全面地回答，我还将提到相关问题：

• 曾经有一个非官方的谷歌拼写检查API
• 你可以使用Chrome的内置字典
• 有

是否有与此相关的事件

否，该事件也没有为此提供任何有用的信息：它没有拼写检查信息，并且您无法读取上下文菜单项列表（其中可能包含拼写建议）。该事件也不提供拼写检查信息

如何在JavaScript中检测文本区域内的拼写错误

您可以自己编写代码，也可以使用第三方库。此主题还有其他堆栈溢出问题，您也可以自己搜索。相关的堆栈溢出问题包括：

---

由于这个问题似乎有点宽泛，可以解释（特别是在当前的赏金“要求”下），我将首先解释我如何解释它，并尝试回答过程中的子问题（Q/a风格）

你似乎在问：

“谷歌铬”/“铬”特定：

Q:如果浏览器“Google Chrome”/“Chrome”公开了拼写检查API，您可以通过在公共网页中使用javascript进行交互
A:不，不是真的（至少不是以你想要的方式）。
有一个特定的铬（从2012年12月起）

以下是其中的一些部分：

此API是否可以作为web平台的一部分？
拼写检查不太可能成为web平台的一部分

更重要的是，它只有一个名为“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.      

重点是什么？帮助社区为祖鲁语、克林贡语等创建自定义词典，因为大约20-30%的拼写检查错误与不支持的语言有关

现在，让我们不要混淆Chrome的拼写检查API（上图）和Chrome/Webkit的拼写检查API（hu？说什么？）：
Hironori Bono（谷歌Chrome的软件工程师）大约在2011年左右，Chrome中的一些和一个（现在仍然？）浏览器

void addSpellcheckRange( unsigned long start
                       , unsigned long length
                       , DOMStringList suggestions
                   // [, unsigned short options]
                       );
void removeSpellcheckRange(SpellcheckRange range);

用法示例：

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

资料来源：
，
（如果此API仍然有效，您应该可以在那里试用它。）
重点是什么？经过几天的思考后，它突然点击：自定义拼写检查与浏览器的集成-使用浏览器的上下文菜单，而不是阻止它，并提供自己的。因此可以将其与现有的外部拼写检查库链接

上述历史和实验API显然从未直接支持您想要实现的目标

Q:如果“Google Chrome”/“Chrome”拼写检查API在（例如）文本区域上暴露“onSpellError”（-like）事件
A:如上所述，Chrome似乎没有此类事件。
HTM5目前仅公开在拼写检查支持的元素上启用或禁用拼写检查的功能

Q:如何访问Chrome对拼写错误单词的拼写检查建议
A:如上所述：看来你不能。这似乎与几乎重复的问题的答案相同：
可能有意思的是注意到“”。现在，如果你在网上搜索，你可能会发现他们是如何做到这一点的，但这显然不是最好的方法（在这里提倡）。
使用javascript拼写检查库，您可以使用Chrome的字典（因此您不需要维护字典），但您必须将这些文件与web应用程序一起提供和发布（而不是在浏览器中获取已安装的文件）

概述：

Q:如何在JavaScript中检测文本区域内的拼写错误
A:Internet Explorer允许使用拼写检查器 通过ActiveX集成到Microsoft Word中，如下所示 代码片段

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

函数检查文本（文本）{
var结果=新数组；
var app=新的ActiveXObject（'Word.Application'）；
var doc=app.Documents.Add（）；
文档内容=文本；
对于（var i=1；i而言，没有用于访问Chrome拼写检查建议的API，也没有在单词输入错误时本机触发的任何事件。但是，可以实现事件

我不知道这个功能的用例是什么，但我用做了一个演示。演示会监视一个文本区域，当用户暂停键入时，它会通过要测试的API发送文本。API返回JSON，其中包含原始字符串、建议的更正字符串以及包含更正的单词和t的对象继承人建议更换

建议显示在文本区域下方。当建议悬停时，键入错误的单词将突出显示。单击时，键入错误将替换为建议

我还添加了一个shuffling函数，它在发送字符串之前对字符串中的单词进行置乱，为API的使用添加了一层隐私（它也使用SSL）。API和Chrome都不使用基于上下文的建议，因此shuffling不会改变结果

以下是代码笔的链接：

代码如下：

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>


* {
字体系列：无衬线；
}
文本区{
边缘底部：10px；
宽度：500px；
高度：300px；
填充：10px；
}
.文字{
宽度：500px；
}
.字{
显示：内联块；
填充物：2px 5px 1px 5p
<textarea id="text" placeholder="Type something here..."></textarea>
<div id="words"></div>

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