autocapitalize="none" 失效通常因更高优先级行为覆盖,如 inputmode="numeric"、js 强制转小写、ui 组件未透传属性或父级 form 设置了 autocapitalize;需配合 spellcheck="false"、autocorrect="off"、autocomplete="off" 三件套才更可靠。

autocapitalize="none" 为什么有时还是首字母大写
写了 autocapitalize="none" 却没用,大概率不是属性写错了,而是被更高优先级行为覆盖了。它本身不报错、不警告,失效时完全静默——你得主动排查干扰源。
哪些场景会让 autocapitalize="none" 失效
常见干扰项包括:
-
inputmode="numeric"、inputmode="tel"或type="number":数字键盘压根没有大小写切换逻辑,autocapitalize直接被忽略 - JS 代码里写了
e.target.value = e.target.value.toLowerCase()或类似强制转换逻辑:键盘刚输的大写,立刻被脚本抹掉,光标还跳动 - 用了 UI 组件库(如 Vant、Ant Design Mobile),但没把
autocapitalize透传到原生<input>上,比如只写了:input-props="{ autocapitalize: 'none' }"却漏了绑定 - 父级
<form></form>设了autocapitalize="words",但子元素没显式覆盖——iOS Safari 不支持继承,必须每个<input>单独写
autocapitalize="none" 必须搭配的其他属性
单靠 autocapitalize="none" 很难彻底禁用首字母大写,尤其在 iOS Safari 下。真正起效需要三件套协同:
-
spellcheck="false":隐藏拼写下划线,同时削弱部分输入法的自动修正倾向 -
autocorrect="off":iOS Safari 中关闭拼写建议和自动替换(Chrome Android 已不认这个,但 iOS 必须有) -
autocomplete="off":防止输入法基于字段名(如name="username")做上下文联想和纠错
完整写法示例:
<input type="text" spellcheck="false" autocorrect="off" autocapitalize="none" autocomplete="off">
容易被忽略的兼容性细节
不同平台对 autocapitalize="none" 的响应差异很大:
- iOS Safari 支持最稳,但前提是系统“设置→通用→键盘”里没强制开启「自动大写」——如果用户开了全局开关,
autocapitalize="none"才能真正压制它 - Android Chrome 90+ 识别
"none"和"sentences",其他值(如"words")会被当作"sentences"处理,所以别指望"none"在所有 Android 上 100% 生效 - 桌面端浏览器基本忽略
autocapitalize,它本质是移动端软键盘提示指令,不是 DOM 行为控制
真正要确保英文输入全小写,不能只靠这个属性;如果业务强要求(比如用户名区分大小写),还得在提交前校验或用 JS 做 toLowerCase() 转换——autocapitalize 只管键盘弹什么,不管用户最终输什么。
大量免费API接口:立即使用
涵盖生活服务API、金融科技API、企业工商API、等相关的API接口服务。免费API接口可安全、合规地连接上下游,为数据API应用能力赋能!











