禁用对 HTML 文本字段的拼写检查答案

【问题标题】：Disable spell-checking on HTML textfields禁用对 HTML 文本字段的拼写检查
【发布时间】：2010-09-20 06:17:19
【问题描述】：

我能否以某种方式禁用 HTML 文本字段的拼写检查（如 Safari 中所见）？

【问题讨论】：

【解决方案1】：

如果您已动态创建 HTML 元素，则需要通过 JS 禁用该属性。但是有一个小陷阱：

设置elem.contentEditable 时，您可以使用布尔值false 或字符串"false"。但是当你设置elem.spellcheck 时，你只能使用布尔值——出于某种原因。因此，您的选择是：

elem.spellcheck = false;

或者他的回答中提供的选项Mac：

elem.setAttribute("spellcheck", "false"); // Both string and boolean work here.

【讨论】：

【解决方案2】：

虽然在中指定 spellcheck="false" 肯定会禁用该功能，但能够在页面加载后根据需要打开和关闭该功能很方便。所以这里有一种非 jQuery 的方式来以编程方式设置 spellcheck 属性：

????：

<textarea id="my-ta" spellcheck="whatever">abcd dcba</textarea>

??????????：

function setSpellCheck( mode ) {
    var myTextArea = document.getElementById( "my-ta" )
        , myTextAreaValue = myTextArea.value
    ;
    myTextArea.value = '';
    myTextArea.setAttribute( "spellcheck", String( mode ) );
    myTextArea.value = myTextAreaValue;
    myTextArea.focus();
}

?????：

setSpellCheck( true );
setSpellCheck( 'false' );

函数参数可以是布尔值或字符串。

无需循环遍历 textarea 内容，我们只需剪切并粘贴那里的内容，然后设置焦点。

在 blink 引擎（Chrome(ium)、Edge 等）中测试

【讨论】：

【解决方案3】：

以下代码 sn-p 为所有 textarea 和 input[type=text] 元素禁用它：

(function () {
    function disableSpellCheck() {
        let selector = 'input[type=text], textarea';
        let textFields = document.querySelectorAll(selector);

        textFields.forEach(
            function (field, _currentIndex, _listObj) {
                field.spellcheck = false;
            }
        );
    }

    disableSpellCheck();
})();

【讨论】：

【解决方案4】：

对于语法，您可以使用：

<textarea data-gramm="false" />

【讨论】：

我在寻找什么，+1

【解决方案5】：

是的，使用spellcheck="false"，由HTML5定义，例如：

<textarea spellcheck="false">
    ...
</textarea>

【讨论】：

MDN 有一个表格显示不同浏览器和元素的拼写检查的默认值：developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/…
我收到一个错误“未知的 DOM 属性拼写检查。您是说拼写检查吗？”使用spellCheck 似乎可以满足它。可能只是一个 react-dom 的事情。
@Shaanimal 是的，react 对 DOM 属性使用驼峰式大小写。见reactjs.org/docs/introducing-jsx.html

【解决方案6】：

更新：根据评论者的建议（How can I disable the spell checker on text inputs on the iPhone），使用它来处理所有桌面和移动浏览器。

<tag autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"/>

原始答案：Javascript 无法覆盖用户设置，因此除非您使用文本字段以外的其他机制，否则这是不可能的（或不应该是）。

【讨论】：

为什么会被接受？它没有意义，因为如果浏览器允许，它可以覆盖用户设置。查看 ms2ger 的回答。
只是因为它是当时最好的答案。我猜 Michiel 没有回过头来将另一个标记为正确。这对我来说很好，因为这是一个更好的答案。
重要的是要注意浏览器兼容性 -- 例如，Mobile Safari (iOS) 不支持该标签 -- wufoo.com/html5/attributes/17-spellcheck.html
stackoverflow.com/questions/3416867/… 对此有正确答案 (autocorrect="off") 对于 Mobile Safari - spellcheck= 不起作用
应该是 autoComplete="off" autoCorrect="off" autoCapitalize="off" spellCheck="false"

【解决方案7】：

至少在 Chrome 中，IFrame 将“触发”拼写检查器（如果它的 content-editable 设置为 true），就像文本字段一样。

【讨论】：

+1 表示“内容可编辑设置为真”的技巧，这是真正的技巧