如何将每个单词的首字母大写，例如一个由两个单词组成的城市名？

Question

当城市名称只有一个单词时，我的JS代码工作得很好：

• cHIcaGO ==> Chicago

但是当它是这样时：

• san diego ==> San diego

我该如何让它变成San Diego？

function convert_case() {
    document.profile_form.city.value =
        document.profile_form.city.value.substr(0,1).toUpperCase() + 
        document.profile_form.city.value.substr(1).toLowerCase();
}

- pepe

Answer 1

这里有一个很好的答案（链接）：

function toTitleCase(str) {
    return str.replace(/\w\S*/g, function(txt){
        return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
    });
}

或者在 ES6 中：

var text = "foo bar loo zoo moo";
text = text.toLowerCase()
    .split(' ')
    .map((s) => s.charAt(0).toUpperCase() + s.substring(1))
    .join(' ');

- Dexter

---

只是想知道（可能是新手问题），JavaScript 如何知道 function(txt) 参数中的 txt 是指 str？这是因为你在 str 上调用了 replace，所以它可以假定吗？ - aug

实际上它并没有传递 str，而是传递了“匹配的子字符串”，例如正则表达式的结果。在 Mozilla 开发者页面 https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/String/replace 的标题为“将函数指定为参数”的部分有一个很好的解释。 - Dexter

脚本不适合处理重音符号，例如它会将“anders ångström”转换为“Anders åNgström”。如果你需要脚本处理这样的字符串，请查看https://dev59.com/GG_Xa4cB1Zd3GeqPwxPp。 - BearCode

我建议您使用\b\w而不是\w\S*，这将选择每个单词的第一个字母，即使介于两个字母之间的字符是斜杠或破折号，而不是空格。 - Barry

不适用于非英语单词。 - Alexey Sh.

Answer 2

您可以使用CSS：

p.capitalize {text-transform:capitalize;}

更新（JS解决方案）：

根据Kamal Reddy的评论：

document.getElementById("myP").style.textTransform = "capitalize";

- capdragon

---

不能仅使用text-transform: capitalize将cHIcaGO转换为Chicago。这样会得到CHIcaGO而不是Chicago。它只能将字符串的第一个字母转换为大写。 - KJYe.Name

因为该问题明确指定了JavaScript，而您提供了使用不同技术的解决方案，所以被投下反对票。 - Rik Smith-Unna

我同意 @RichardSmith-Unna 的观点，问题指定了如何使用 JavaScript 完成此操作。这个回答相当于回答“如何用纸和笔除法”与“拿个计算器使用除法功能”相同。 - Nick Res

因为没有使用提问者要求的语言回答而被踩。 - dtburgess

对于所有因为解决方案不在JS中而感到受伤的人，这里提供一个解决方案。document.getElementById("myP").style.textTransform = "capitalize"; - Kamal Reddy

Answer 3

function convertCase(str) {
  var lower = String(str).toLowerCase();
  return lower.replace(/(^| )(\w)/g, function(x) {
    return x.toUpperCase();
  });
}

- maerics

---

@enver的评论不起作用，因为String.toUpperCase将绑定到String对象（this将是String，而不是子字符串）。 - kikito

ES6的快捷写法：str.toLowerCase().replace(/(^| )(\w)/g, s => s.toUpperCase()) 可以将字符串中每个单词的首字母大写，并保留原来的大小写格式。 - Claudio Holanda

@ClaudioHolanda：...这与答案中的相同 :) - Parzh from Ukraine

它不能处理带有重音符号的字符，例如“Úrsula”。 - Tiago Gouvêa

@rakensi的版本在IE 11（以及可能更低版本）中无法工作。 - Hugo Delsing

@rakensi 我认为你应该删除你的评论，我看到你已经知道它没有像预期的那样工作，所以留下它没有意义...（无论如何还是谢谢你的尝试） - Gabriel Belini

Answer 4

上面这段JavaScript函数代码：

String.prototype.capitalize = function(){
       return this.replace( /(^|\s)([a-z])/g , function(m,p1,p2){ return p1+p2.toUpperCase(); } );
      };

使用这个函数的方法：

capitalizedString = someString.toLowerCase().capitalize();

此外，这也适用于多个单词的字符串。

为确保转换后的城市名称已注入数据库，需要在发送到服务器端之前使用JavaScript将其小写化并将首字母大写。CSS仅负责样式，但实际数据仍然是预设的样式。请查看此jsfiddle示例，并比较警告消息与经过样式处理的输出。

- KJYe.Name

---

可以，但不要将其添加到 String.prototype。 - Travis Webb

如果你想要添加到 String.prototype 并且添加一个 toLowerCase()，请使用以下代码：if(!String.prototype.toTitleCase) { String.prototype.toTitleCase = function(){ return this.toLowerCase().replace( /(^|\s)([a-z])/g , function(m,p1,p2){ return p1+p2.toUpperCase(); } ); }; } - user1071182

它不支持带重音符号的字符，例如“Úrsula”。 - Tiago Gouvêa