我只是想知道是否可以在某个 input
字段上将输入自动更改为 capitalized
,用户在该字段中输入了一个大写锁定的值。
<input placeholder="Brand Name" style="text-transform: capitalized" type="text" />
上限 = 测试名称
预期:测试名称
<input placeholder="Brand Name" style="text-transform: capitalized" type="text" />
Caps Off = 测试名称
默认:测试名称
我知道有些名称看起来像 Reader Van der Bank
,其中并非所有名称部分都大写,但仍然想知道它是否可能。谢谢
备选方案:认为我可能正在使用 php 函数将所有内容转换为小写,然后大写。
最佳答案
如果没有 CSS 解决方案,这里有一个 javascript 函数可以做到这一点。
var id = document.getElementById("test");
function change() {
var arr = id.value.split(" ").map(function(x) {
return x.charAt(0).toUpperCase() + x.slice(1).toLowerCase()
});
id.value = arr.join(" ");
}
id.addEventListener("change", change);
id.addEventListener("keyup", change);
<input placeholder="Brand Name" id="test" type="text" />
对于类为 test
的多个元素
var elements = document.getElementsByClassName("test");
function change() {
var arr = this.value.split(" ").map(function(x) {
return x.charAt(0).toUpperCase() + x.slice(1).toLowerCase()
});
this.value = arr.join(" ");
}
for (var i = 0; i < elements.length; i++) {
elements[i].addEventListener("change", change);
elements[i].addEventListener("keyup", change);
}
<input placeholder="Brand Name" class="test" type="text" />
<input placeholder="Brand Name" class="test" type="text" />
<input placeholder="Brand Name" class="test" type="text" />
<input placeholder="Brand Name" class="test" type="text" />
<input placeholder="Brand Name" class="test" type="text" />
<input placeholder="Brand Name" class="test" type="text" />
关于javascript - 在 CapsLock 开启的情况下将输入更改为大写,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46524990/