spellcheck="true"无红色波浪线是因系统拼写开关、英文直输输入法、可编辑元素三者未同时满足;需显式设置textarea spellcheck="true",仅text/search类input可靠生效,contenteditable需透传属性,ios依赖系统键盘设置。

写了 spellcheck="true" 却没红色波浪线?不是代码写错了,而是浏览器根本没启动拼写服务——它需要系统、输入法、元素类型三者同时就位,缺一不可。
textarea 必须显式设 spellcheck="true"
别信“默认就开”。虽然部分浏览器对 <textarea></textarea> 默认启用,但 Firefox 可能关着,Safari 在中文输入法下直接不响应。统一写死最稳:
-
<textarea spellcheck="true"></textarea>或简写<textarea spellcheck></textarea> - 禁用时写
spellcheck="false",比如用户名、代码片段等场景 - 输入明显错词(如 recieve)后,按空格或回车才触发标红,不是实时逐字检查
哪些 input type 真正响应 spellcheck
不是所有 <input> 都买账。浏览器优先走格式校验逻辑,拼写检查常被跳过:
- 可靠生效:
type="text"、type="search"—— 显式加spellcheck="true"最稳妥 - 基本无效:
type="email"、type="url"、type="tel"—— Chrome/Firefox 通常静默忽略 - 完全无视:
type="password"、type="number"、type="date"—— DOM 解析时就被丢弃 - 移动端特别注意:
inputmode="numeric"或inputmode="tel"会让键盘直接禁用拼写逻辑
contenteditable 元素 spellcheck 要手动透传
contenteditable="true" 的 <div> 或 <code><p></p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf"><img
src="https://img.php.cn/upload/skill/000/000/081/178956546773641.jpg" alt="html-ppt-to-pdf" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf" class="overflowclass">html-ppt-to-pdf</a>
<p class="overflowclass">将使用 `<section class="slide">` 约定的 HTML 幻灯片转换为高保真、矢量文本 PDF(使用 Playwright + Chromium 原生 PDF 功能)。</p>
</div>
<a rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div> 默认不检查,且 spellcheck 不继承:
- 错写:
<div contenteditable="true"><p>hello</p></div>——<p></p>里不会标红 - 正确:
<div contenteditable="true" spellcheck="true"><p spellcheck="true">hello</p></div> - 父级设了
spellcheck="false"会覆盖子级,嵌套结构里容易漏查 - CSS 干扰:加了
user-select: none或pointer-events: none可能导致编辑态异常,波浪线压根不渲染
为什么 spellcheck="false" 还有红线
尤其在 iOS Safari 上,spellcheck="false" 常失效。这不是 bug,是系统级行为:
- iOS 完全不响应
spellcheck属性,只依赖「设置 → 通用 → 键盘」里的「自动更正」和「拼写检查」开关 - Chrome 中仍有红线,大概率是 Grammarly 等插件或浏览器内置语法高亮在干扰,不是原生拼写检查
- 验证是否真生效:右键点击错词,看菜单里有没有「更正为…」选项;若禁用时仍有,说明系统级设置没关
最易被忽略的点是输入法状态——哪怕你打的是英文单词,搜狗、微软拼音等中文输入法会拦截拼写反馈。必须切换到纯英文直输模式(比如按 Shift),再配合系统拼写开关开启、词典安装完成,才能看到那条红色波浪线。










