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

问:如果浏览器"Google Chrome"/"Chromium" 公开了一个拼写检查API,您可以通过在常用网页中使用javascript进行交互
A:不,不是真的(至少不是您想要的方式).
有一个特定于Chromium的拼写检查API 提案(自2012年12月起).

以下是它的一些部分:

这个API可以成为网络平台的一部分吗？
拼写检查不太可能成为网络平台的一部分.

更重要的是,它只有一个名为'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.      
```
Run Code Online (Sandbox Code Playgroud)
关键点？帮助社区为Zulu,Klingon等创建自定义词典,因为大约20-30%的Spellcheck错误搜索是关于不受支持的语言.

现在让我们不要混淆Chrome的SpellCheck API(上面)和Chrome/Webkit的SpellCheck API(胡？说什么？):
Hironori Bono(谷歌Chrome的软件工程师)在2011年左右提出了一个API以及一些相关的bug支持和补丁( /仍然是？)在Chrome中.
```
void addSpellcheckRange( unsigned long start
                       , unsigned long length
                       , DOMStringList suggestions
                   // [, unsigned short options]
                       );
void removeSpellcheckRange(SpellcheckRange range);
```
Run Code Online (Sandbox Code Playgroud)
用法示例:
```
var input = document.querySelector('input');
input.addSpellcheckRange( 4
                        , 9
                        , [ 'Chrome'
                          , 'Firefox'
                          , 'Opera'
                          , 'Internet Explorer'
                          ]
                        );
```
Run Code Online (Sandbox Code Playgroud)

^{来源:

http://html5-demos.appspot.com/static/html5-whats-new/template/index.html#42,

http://peter.sh/experiments/spellcheck-api/ (你应该能够尝试它住在那里如果这个API仍然有效..)}
重点？在考虑了这几天后,它突然点击了:自定义拼写检查与浏览器的集成 - 使用浏览器的上下文菜单而不是阻止它并提供您自己的.因此可以将其与现有的外部拼写检查库链接起来.

以上历史和实验API显然从未直接支持您想要实现的目标.
问:如果"Google Chrome"/"Chromium"spellcheck-API 在(例如)textarea A上暴露了"onSpellError"(类似)事件
:如上所述,Chrome似乎没有此类事件.
HTM5目前仅暴露启用或禁用拼写检查支持元素的拼写检查的功能.
问:如何访问Chrome对拼写错误的单词的拼写检查建议
A:如上所述:看起来你不能.对于几乎重复的问题,它似乎是相同的答案:如何访问Chrome的拼写检查字典？
值得注意的是," TinyMCE的拼写检查程序以前是由'黑客攻击'谷歌拥有的Chrome工具栏API提供的,而不是谷歌自己的合法使用政策.这种拼写检查服务已经永久停止. " 现在,如果你在网上搜索,你可能会发现他们是如何做到这一点的,但它似乎并不是最好的方式(并在此提倡).
然而,使用javascript拼写检查库,您可以使用Chrome的词典(因此您不需要维护词典),但您必须提供这些文件并将其与您的网络应用程序一起发送(而不是在浏览器中提取已安装的文件) ).

一般:

问:如何在JavaScript中检测textarea中的拼写错误
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;
}
```
Run Code Online (Sandbox Code Playgroud)
^{资料来源:https://lists.w3.org/Archives/Public/public-webapps/2011AprJun/0516.html}

但IE/ActiveX/MS-Word并不是你所要求的,也不是非常跨平台/浏览器,这使我们得到了本地javascript拼写检查库:
Javascript拼写检查方法
 http://code.google. com/p/bjspell/
http://www.javascriptspellcheck.com/
http://ejohn.org/blog/revised-javascript-dictionary-search/
等等.
比较/解释它们实际上超出了这个答案的范围.
值得注意的是你想要使用的字典格式!

或者,可以使用外部拼写检查API服务(服务器处理数据并使用AJAX与之通信).
显然你需要考虑隐私问题!

赏金 - '要求'要求:

问:明确的证据
答:我应该找到一些关于这个主题的东西,而不是一些深奥的实验性特征.我也没有看到试图将其功能强调为某些(即将出现的)标准化方法/事件标识符等的
库.如上所述,像TinyMCE这样的流行库目前还没有其他解决方案.
在"生活标准"/"世界是我们的游乐场"的心态中,当我按下"提交"按钮时,我的答案很可能已经过时了.但即使这样,我也不会在不久的将来在"生产"级别的网站/界面上推荐这样的实验性功能.
问:并获得一个很好的答案,解释如何实现这一点
(特定于铬或一般？拼写检查建议或检测到有拼写错误？)
答:除了上述之外,我什么都想不到(除了图书馆)网络开发人员目前使用(见4)).

希望这可以帮助!

感谢您的彻底回答！:) (2认同)

Answer 3

aec*_*end 5

没有用于访问Chrome的拼写检查建议的API,也没有在错误输入单词时触发的任何事件.但是,可以实施事件.

我不知道你的用例是什么用于此功能,但我在MashApe上使用montanaflynn的Spellcheck API进行了演示.该演示观看文本区域,当用户暂停键入时,它通过API发送文本进行测试.API返回包含原始字符串的JSON,建议的更正字符串以及包含更正后的单词及其建议替换的对象.

建议显示在textarea下方.当建议悬停时,会突出显示输入错误的单词.单击时,拼写错误将替换为建议.

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

这是CodePen的链接:http://codepen.io/aecend/pen/rOebQq

以下是代码:

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>

Run Code Online (Sandbox Code Playgroud)

HTML

<textarea id="text" placeholder="Type something here..."></textarea>
<div id="words"></div>

Run Code Online (Sandbox Code Playgroud)

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>

Run Code Online (Sandbox Code Playgroud)

我只使用jQuery来简化此演示的AJAX请求.这可以很容易地在vanilla JS中完成.

归档时间：	10 年，6 月前
查看次数：	11037 次
最近记录：	10 年，2 月前