本文介绍如何利用 jQuery 实现对输入文本中每个单词首字母进行大写的标准化处理，通过 split()、map() 和 join() 链式操作高效完成，兼容空格分隔的多词字符串，并确保其余字母转为小写。
本文介绍如何利用 jquery 实现对输入文本中每个单词首字母进行大写的标准化处理，通过 split()、map() 和 join() 链式操作高效完成，兼容空格分隔的多词字符串，并确保其余字母转为小写。
在 Web 表单开发中，常需对用户输入进行格式化处理，例如将“hello world example”自动转换为“Hello World Example”。原代码仅处理了整个字符串的首字符（charAt(0).toUpperCase()），忽略了后续单词，因此无法满足“每个单词首字母大写”的需求。
正确做法是：以空格为分隔符拆分字符串 → 对每个单词单独首字母大写+其余小写 → 重新拼接。以下是优化后的 jQuery 实现：
$("#btn4").click(function() {
const inputValue = $("#input1").val().trim();
if (!inputValue) return; // 忽略空输入，提升健壮性
const capitalized = inputValue
.split(' ') // 按空格分割成单词数组
.map(word => {
if (word.length === 0) return word; // 跳过空字符串（如连续空格）
return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
})
.join(' '); // 用单个空格连接回字符串
$("#input1").val(capitalized);
});
✅ 关键说明：
jQuery 1.12.4
下载
jQuery 1.12.4是jQuery 1.x系列的最后一个正式稳定版本，由jQuery团队于2016年发布。该版本主要面向需要兼容旧版浏览器环境的网站和Web应用，尤其适用于仍需支持Internet Explorer 6、Internet Explorer 7、Internet Explorer 8等老旧浏览器的项目。
- 使用
.trim()预处理，避免前后空格导致异常； -
word.slice(1)替代substr(1)（后者已废弃，slice()更标准且行为明确）； - 显式判断
word.length === 0，兼容输入中存在多个连续空格的场景（如"a b c"→"A B C"保持原有空格结构）； - 若需更严格的单词识别（支持标点、连字符等），建议改用正则匹配（如
/\b\w/g），但本例聚焦简洁可靠的空格分隔方案。
⚠️ 注意事项：
- 该方法假设单词以英文空格分隔；中文、日文或混合排版场景不适用；
- 不会修改原始输入框的
placeholder或data-*属性，仅更新value； - 建议搭配
input事件做实时格式化时，增加防抖逻辑，避免频繁触发影响性能。
此方案轻量、可读性强，无需引入额外库，适用于 Bootstrap 表单、后台管理界面等常见业务场景。
