Можно ли отключить автокапитализацию с помощью javascript в мобильном сафари?

Question

Мобильное сафари поддерживает атрибут на входных элементах, который называется autocapitalize [ задокументировано здесь ], что, если установлено значение «выкл.», Не позволит iPhone вводить текст в это поле с прописной буквы, что полезно для полей URL или электронной почты.

<input type="text" class="email" autocapitalize="off" />

Но этот атрибут недопустим в html 5 (или, насколько мне известно, в другой спецификации), поэтому включение его в html приведет к созданию недопустимой html-страницы, и я хотел бы добавить этот атрибут к конкретному поля загружаются с помощью javascript примерно так:

$(document).ready(function(){
  jQuery('input.email, input.url').attr('autocapitalize', 'off');
});

, который добавляет правильный атрибут в Firefox и настольном сафари, но, похоже, ничего не делает в мобильном сафари, почему?

Answer 1

Примечание. Вы можете еще больше улучшить взаимодействие с пользователем на iOS, указав тип ввода «электронная почта», чтобы автоматически вызывать клавиатуру «электронная почта» (немного лучшие символы для ввода электронной почты).

<input type="email" class="email" autocapitalize="off" />

Вот некоторая документация о том, как типы ввода могут управлять клавиатурой iOS.

Answer 2

Это должно быть исправлено в iPhone OS 3.0. На какой версии iPhone OS вы это примеряете?

Email: <input id="email" type="text"><br>
URL: <input id="url" type="text"><br>
<script>
//document.getElementById("email").autocapitalize = 'off';
//document.getElementById("url").autocapitalize = 'on';
document.getElementById("email").setAttribute('autocapitalize', 'off');
document.getElementById("url").setAttribute('autocapitalize', 'on');
alert(document.body.innerHTML);
</script>

Answer 3

Это так же недопустимо, если вы добавляете его через скрипт или если вы добавляете его в разметку. Просто валидатор не сможет заметить это, если вы добавите его с помощью скрипта.

Просто поместите его в разметку и поставьте рядом с ним комментарий, например <!-- the "autocapitalize" attribute is an Apple proprietary extension for the iPhone to change its IME behaviour -->, чтобы люди, которые смотрят код в валидаторе, знали, что случилось.

Answer 4

Если это полезная функция, вам просто нужно выбрать между строгой проверкой и пользовательским опытом. Лично я бы выбрал UX в любой день.

Answer 5

Таким образом, я не мог заставить jQuery это сделать, кроме простого старого javascript, как предложил ddkilzer, поэтому я собрал эту функцию, чтобы применить параметр autocapitalize = 'off' ко всем входам определенного класса:

$(document).ready(function(){
  // disable autocapitalize on .url, .email fields
  unautocapitalize('url');
  unautocapitalize('email');
});

function unautocapitalize(cssClass){
  var elems = document.getElementsByClassName(cssClass);
  for (var j = 0; j < elems.length; j++){
    elems[j].setAttribute('autocapitalize', 'off');
  }
}