javascript - 大写 HTML <option> selected 属性

Question

我正在尝试将 HTML 选定的属性大写，但不起作用!

<option value="${city}" style="text-transform: capitalize"> ${fn:toLowerCase(city)}</option>

Answer 1

正如对建议使用 CSS text-transform 方法的答案的评论中提到的那样，Chrome 似乎存在不一致之处。搜索网络，这似乎在某种程度上是一个已知问题。参见 here和 here一些细节。不确定这已经知道多久了，甚至可能在某个时候解决了，但根据 Windows 上的 Chrome 版本 43.0.2357.124 m，我仍然可以 replicate this issue - 参见 screen cap还有

如果 Chrome 的一致性问题足够严重，您可以使用一些 JavaScript 来解决这个问题。一些示例可能包括...

jQuery - JSFiddle Example

$('option').each(function() {
    $(this).text($(this).text().replace(/^(.)|\s(.)/g, function($1){ return $1.toUpperCase(); }));
});

---

Vanilla - JSFiddle Example

var ele = document.getElementsByTagName('OPTION')

for(var i = 0; i < ele.length; i += 1) {
    ele[i].text = ele[i].text.replace(/^(.)|\s(.)/g, function($1){ return $1.toUpperCase(); })
}