使用默认的iOS键盘，在iOS 8,9下的移动Safari中，<input>属性autocapitalize="words"损坏。它会将字段的前2个字母大写，而不是每个单词的第一个字母。
官方文档说受支持:https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/Attributes.html
要进行测试，请在iOS模拟器或真实设备上打开以下字段:
First name: <input type="text" autocorrect="off" autocapitalize="words" value="First Name">
您可以使用https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_form_submit进行测试，也可以在iOS 8或9上使用以下代码段进行测试:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test autocapitalize</title>
</head>
<body>
<form>
<label for="words">autocapitalize="words"</label>
<input type="text" autocapitalize="words" name="text1" id="words" /><br />
<label for="sentences">autocapitalize="sentences"</label>
<input type="text" autocapitalize="sentences" name="text2" id="sentences" /><br />
<label for="none">autocapitalize="none"</label>
<input type="text" autocapitalize="none" name="text3" id="none" />
</form>
</body>
</html>我感到惊讶的是，自8.x起，这种情况就一直存在，并且已经被忽略了。
有已知的解决方法吗？
更新10/13:
iPhone 6s + Safari完全忽略在输入字段上设置的任何HTML属性。
最佳答案
如果您愿意(临时)包括以下库:https://github.com/agrublev/autocapitalize，则似乎可以解决此问题。但是，它确实需要jQuery，因此在移动设备上可能并不理想。我创建了这一小段代码，仅使用单词而不使用jQuery来完成的相同功能。当然可以扩展到也包括其他情况。
下面的示例还大写了页面准备就绪时的单词，而不仅仅是在'keyup'事件中。我已经在几种设备上测试了代码，但没有出错。但是，如果某事无效或您觉得可以做得更好，请随时发表评论。
请注意，我添加的“domReady”功能适用于IE9及更高版本。如果您需要支持旧版本，请参阅this。// Create one global variable
var lib = {};
(function ( lib ) {
lib.autocapitalize_element = function (element) {
var val = element.value.toLowerCase();
var split_identifier = " ";
var split = val.split(split_identifier);
for (var i = 0; i < split.length; i ++) {
var v = split[i];
if ( v.length ) {
split[i] = v.charAt(0).toUpperCase() + v.substring(1);
}
};
val = split.join(split_identifier);
element.value = val;
}
lib.autocapitalize_helper = function(element) {
element.onkeyup = function(e) {
var inp = String.fromCharCode(e.keyCode);
if (/[a-zA-Z0-9-_ ]/.test(inp)) {
lib.autocapitalize_element(element);
}
};
}
lib.autocapitalize = function() {
var elements = document.querySelectorAll("input[autocapitalize], textarea[autocapitalize]");
for(var i = 0; i < elements.length; i++) {
lib.autocapitalize_helper(elements[i]);
lib.autocapitalize_element(elements[i]);
}
}
lib.domReady = function(callback) {
document.readyState === "interactive" || document.readyState === "complete" ? callback() : document.addEventListener("DOMContentLoaded", callback);
};
}( lib ));
// This function gets called when the dom is ready. I've added it to the lib variable now because I dislike adding global variables, but you can put it anywhere you like.
lib.domReady(function() {
lib.autocapitalize();
});
关于ios8 - 在iOS 8,9的移动Safari上自动将=“words”变为大写-是否有解决方法？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32655529/